CSS3学习

看到的时候so what,用到的时候wow！回头看看

字体展示组合拳

text-wrap   规定文本的换行规则。  
word-break  规定非中日韩文本的换行规则。  
word-wrap   允许对长的不可分割的单词进行分割并换行到下一行。
text-justify    规定当 text-align 设置为 "justify" 时所使用的对齐方法。

1、普通的文本段

对于普通的文本段的话只需要定义下面三个属性

p {
   white-space: nowrap; /* 使内容不自动换行 对应的还有 normal 自动换行 */
   overflow: hidden; /* 超出容器范围的内容隐藏 */
   text-overflow: ellipsis; /* 文本超出容器范围以 ... 做截断 */
}

<p>hello world hello world hello world hello world hello world hello world hello world hello world hello world hello world </p>

    

2、表格的文本段

   当在表格中想要实现此效果时需要将此表格的 table-layout 设为 fixed

table {
    width: 100%;
    table-layout: fixed; /* 一定要有此属性 */
}
td {
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}

    其他与普通文本段的定义没区别

CSS3 选择器

选择符类型	表达式	描述
子串匹配的属性选择符

理解上去还是比较绕的。列举两个使用实例

1 :not：$(‘body’):not(‘input’)错解成body中除了input的元素。 实际为选出$(‘body’)同级的不是input的
2 :last-child
父元素中最后一个E元素，而不是当前元素