[英]Tailwind CSS Breakpoints
I can't figure out why the responsive breakpoints of tailwind css are not working in my project.我不明白为什么 tailwind css 的响应断点在我的项目中不起作用。
Suppose, I'd like to add some padding in my parent div and want to minimise it on the md & lg screen size but it doesn't work.假设,我想在我的父 div 中添加一些填充,并希望在 md 和 lg 屏幕尺寸上将其最小化,但它不起作用。
<div class="text-grey-4 flex-1 lg:px-6 md:px-4 px-0 sm:text-left text-center self-center"><h2 class="h2"><b>Heading Text</b></h2><div> Lorum ipsum lorum ispum lorum ipsum Lorum ipsum lorum ispum lorum ipsum Lorum ipsum lorum ispum lorum ipsum</div></div>
Tailwind-css
follows mobile-first
breakpoint system. Tailwind-css
遵循mobile-first
断点系统。 Any default style added will be considered for mobile
devices and classes for medium
and large
devices needs to be specified seperately.添加的任何默认样式都将被考虑用于
mobile
设备,而用于medium
和large
设备的类需要单独指定。
Consider the following code:考虑以下代码:
<div class="py-2 md:py-32 lg:py-64 text-4xl">
<h1>Hello</h1>
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.