HTML和css笔记

Google Chrome浏览器不支持小于12px的字体大小解决方法

Chrome浏览器不支持小于12px的字体，IE、Firefox、Opera(12.0其他版本不知道支不支持)。现在我们要解决Chrome浏览器的这一BUG。很简单只要写上-webkit-text-size-adjust:none;（取消webkit的对文字的自动调整）问题就解决了，你可以把它放在body里或者具体项目元素上。 （PS:加上后字体在Chrome浏览器里的放大效果变为不可用。）
文本缩进
em这个单位的意思就是文字的高度，1em就是1个文字的高度，2em就是两个文字高度，所以我们写的"text-indent:2em;"的意思就是， 文本缩进2个文字的高度，因为汉字是方块字，高度和宽度是一样的，所以缩进2个文字的高度，就等于缩进两个文字的宽度，最后的效果就是缩进了两个文字。 （PS:text-indent只能加在块状元素上面，内联元素是不起作用的。）
内联元素转块级元素
内联元素无法设置宽度和高度，通过display:block;（或display:inline-block）把内联元素转换为块级元素（或内联块级元素），才可设置宽度和高度。
浏览器前缀（私有格式）
-webkit-（for Chrome 、Safair）
-moz-（for FireFox）
-o-（for Opera）
-ms-（for IE）
Text-transform
text-transform属性允许你应用uppercase(大写), lowercase(小写), 以及capitalize(首字母大写)等效果到你的文字。当然，该属性不能用于中文。
text-transform: capitalize;
text-transform: uppercase;
text-transform: lowercase;
text-transform: inherit;
Text-decoration
text-decoration属性允许你使用一些文字修饰，比如下划线(underline)、上划线(overline)、删除线(line-through)以及文字闪烁(blink)。
text-decoration: none;
text-decoration: underline;
text-decoration: overline;
text-decoration: line-through;
text-decoration: blink;
（PS:text-decoration设置为blink（只有Firefox 和Opera 支持））
Font-Variant
font-variant属性允许你制作小型大写字母效果，也就是将小写字母变成大写并减小字体型号 。
font-variant: small-caps;
Letter-Spacing和word-spacing
letter-spacing添加字母之间的空白，而word-spacing添加每个单词之间的空白。请注意，word-spacing对中文无效, letter-spacing对中文有效。
:first-letter与:first-line
first-letter就是第一个字母或文字，first-line是第一行文字。 （PS： :first-letter 只能与块级元素关联。）