本篇文章围绕了 CSS 的核心知识点和项目中常见的需求来展开。虽然行文偏长，但较基础，适合初级中级前端阅读，阅读的时候请适当跳过已经掌握的部分。 这篇文章断断续续写了比较久，也参考了许多优秀的文章，但或许文章里还是存在不好或不对的地方，请多多指教，可以评论里直接提出来哈。 小t…

flex布局即为弹性布局，可以使元素具有伸缩性，根据父容器的大小，来决定收缩还是扩展。设为flex布局以后，子元素的float、clear和vertical-align属性将失效。 不过由于父盒子的宽度限制，不能全部排满。接下来我们就来试试flex布局↓ 是不是发现和float…

以上是 CSS 水平居中的 8 种方法。 注：① 子元素 line-height 值为父元素 height 值。② 单行文本。 适应 IE7。 元素高度可以动态改变, 不需再CSS中定义, 如果父元素没有足够空间时, 该元素内容也不会被截断。 IE6~7, 甚至IE8 beta…

Grid 布局即网格布局，是一种新的 CSS 布局模型，比较擅长将一个页面划分为几个主要区域，以及定义这些区域的大小、位置、层次等关系。号称是最强大的的 CSS 布局方案！！

这是一期分享HTML中span标签，如何设置宽度的问题。 span表示行内元素，相当于inline属性，只会根据元素的宽度自行展开，自己设置宽度，不起作用。 那如果我特别希望将span元素设置为宽度且不设置元素呢？下面通过几个方式去实现。 但是这样写就体现不了span这个标签的…

//设置文本自动换行，行内元素数字字母需要设置，块级标签一般会超出自动换行。 //超出盒子设置滚动条，并且自定义滚动条样式，以下滚动条样式最好都设置。

在我们的日常开发工作中，文本溢出截断省略是很常见的一种需考虑的业务场景细节。看上去 “稀松平常” ，但在实现上却有不同的区分，是单行截断还是多行截断？多行的截断判断是基于行数还是基于高度？这些问题之下，都有哪些实现方案？他们之间的差异性和场景适应性又是如何？凡事就怕较真，较真必…

在css中某些样式是具有继承性的，那么什么是继承呢？官方解释，继承是一种规则，它允许样式不仅应用于特定的html标签元素，而且应用于其后代元素。 那么该颜色不仅仅应用在了div标签，还应用与div标签中的所有子元素(包括div中的文本和span包含的文本)文本。 给div设置b…

transition：transition 不支持 display。