我后来才反应过来...这玩意儿太长了吧... 2 02 2 年的时候我还在北京，那天我加完班，差不多晚上十一点... 我点开这个网页，就看见这堆代码... 我当时也懵了，啥玩意儿啊这是... 我寻思着这可能是个啥新功能？可能我偏激... 我没多想，关了页面... 过了会儿，我又打开看看，还是那堆玩意儿... 我就没再管了...

如何制作 10px 或者更小像素的字体

对，就是小字体难搞。
PC用CSS3 缩放，移动Webkit用webkittextsizeadjust。

Chrome缩放例子：fontsize:1 2 px0.8 3 ; 兼容IE用hack：fontsize:1 0px;
移动端取消自动调整：webkittextsizeadjust:1 00%;
注意，小字太小，用户看不清，体验差。
得看浏览器怎么解析，灵活调整。

如何用css选择器选中第一行文字样式

哎哟，说起这个::first-line伪元素，我还真有点心得。
以前在做网页设计的时候，这玩意儿可是帮了我大忙。

首先呢，这::first-line主要是用来给块级元素的第一行文字加样式，比如你用div、p、h1 到h6 、article、section这些块级元素，都能用上它。
不过，内联元素比如span、a、strong之类的，它就不认识了。

当时我刚开始学这东西的时候，还不太明白怎么用，后来发现，你给这些块级元素的::first-line加上样式，比如把字体变粗、变蓝，那效果还是挺不错的。
像这样写：p::first-line{font-weight:bold;color:blue;}，你看，就这么简单几行代码，段落的首行就变成了加粗和蓝色。

不过，这玩意儿也不是万能的。
它不支持一些布局属性和定位属性，比如margin、padding、border、width、height这些，还有position、float之类的。
你想调整这些，那得另找办法。

还有个细节，就是第一行的范围是由容器宽度决定的。
你把浏览器窗口缩小或放大，或者改变元素宽度，首行内容可能会变，但样式会自动跟上。

说回语法，我一般推荐用双冒号（::first-line），这是CSS3 的标准。
虽然老一点的浏览器可能只认识单冒号（:first-line），但我还是建议统一用双冒号，这样看起来更规范。

比如，你想让文章段落的首行显示成小型大写字母，字间距增加，颜色变深，可以这样写：.articlep::first-line{font-variant:small-caps;letter-spacing:1 px;color:3 3 3 ;}。

再比如，给标题的首行加粗，并加个阴影，可以这样写：h1 ::first-line{font-weight:bold;text-shadow:1 px 1 px 2 px rgba(0,0,0,0.2 );}。

还有个例子，如果你想在多个段落的同一行上设置统一的样式，比如字体大小和行高，你可以这样写：div.contentp::first-line{font-size:1 .1 em;line-height:1 .5 ;}。

不过，这东西在老版本的浏览器上可能不支持，比如IE8 及以下，就只能用单冒号语法了。

总之，::first-line这个伪元素还是挺实用的，尤其是在做文章排版或者标题设计的时候。
不过用的时候也要注意细节，比如元素类型、样式属性的限制，还有语法规范这些。