CSS Media Query

【CSS Media Query】  CSS Media Queries are a feature in CSS3 which allows you to specify when certain CSS rules should be applied. This allows you to ap
2次阅读

从逻辑思维中学习CSS,从宽高说起

从宽高说起从宽高说起,我们知道一个物体的大小是由长、宽、高三个方向的尺寸决定的,但是你想啊电脑显示器是一个平面的,而不是3维,另因网页大部分情况下只需要使用到2维,所以为了简单在CSS中只有宽和高的设置。有了宽和高的概念以后,就会产生另外一个问题,如果内容超出宽和高以后是该显示还是隐藏呢?为了解决这
6次阅读

css定位

【css定位】1、div、h1 或 p 元素常常被称为块级元素。这意味着这些元素显示为一块内容,即“块框”。与之相反,span 和 strong 等元素称为“行内元素”,这是因为它们的内容显示在行中,即“行内框”。2、在一种情况
3次阅读

我从现象中学到的CSS

文字溢出隐藏如果你观察过浮动元素,你会发现这样一个事实,当前一个元素将宽度占满以后,后一个元素就会往下掉,如下所示代码如下<style> div,p{ margin:0; } #box{ width: 100px; height: 20px; border:
229次阅读

css中字体大小在不同浏览器兼容性问题

css中使用font-size设定字体大小,不同浏览器的字体height一样,但是width不同,比如在火狐和谷歌中,font-size:20px,字体的高度变为20px,但是谷歌的字体宽度比火狐长一,解决方法如下:1、 将浏览器的基准字号设置为 62.5%,也就是 10px,现
6次阅读

[CSS] Build Responsive CSS Layouts with Tachyons

Building responsive css layouts is critical in any modern website. Tachyons makes this easy by designing for mobile first then enabling you to switch
7次阅读

[CSS] Specify grid columns, rows, and areas at once with the grid-template shorthand

We can specify grid columns, rows, and areas in one property using the grid-template shorthand.  .container { display
8次阅读

[CSS] Re-order the appearance of grid items using the order property

As with flex items, we can set an order value on grid items. Let’s see how this affects the DOM and the appearance of our grid. &
6次阅读

IDEA编译less插件LESS CSS Compiler的安装

1.IDEA插件地址:LESS CSS Compiler  百度云盘下载地址2.安装Node.js,下载3.打开idea→settings→plugins 安装:“nodejs”插件,并按以下步骤进行配置:4.打开idea→settings→Languages & Fra
6次阅读

[CSS] Change the auto-placement behaviour of grid items with grid-auto-flow

We can change the automatic behaviour of what order our grid items appear. We can even re-order the items in our grid to fill available space using th
10次阅读