入门任务8

1. 块级元素和行内元素分别有哪些？动手测试并列出4条以上的特性区别

• 块级元素(block-level)：div h1 h2 h3 h4 h5 h6 p hr form ul dl ol pre table li dd dt tr td th

• 行内元素(inline-level):em span strong a链接 br img button input label select textarea code script

  
  
  

  image.png
• 块级元素占据整行空间，行内元素占据自身得高度宽度
• 块级元素可以设置宽高，行内元素不能设置
• 块级元素可以包含行内元素，行内元素只能包含文本和行内
• 块级元素可以调整margin和padding，行内元素只能调整左右的margin和padding，不能调整上下的margin和padding。

2. 什么是 CSS 继承? 哪些属性能继承，哪些不能？

• CSS得属性可以向下继承，子元素可以继承父元素得属性。
• color，font可以继承
• border，margin，padding不可继承

3. 如何让块级元素水平居中？如何让行内元素水平居中?

• 块级元素水平居中：margin：0 auto
• 行内元素水平居中：在父元素设置text-align:center

4. 用 CSS 实现一个三角形

   
   
   

   image.png

5. 单行文本溢出加 ...如何实现?
   white-space:nowrap
   overflow:hidden
   text-overflow:ellipsis

   
   
   

   image.png
6. px, em, rem 有什么区别

• px固定单位，像素
• em相对单位，相对于父元素字体大小
• rem相对单位，相对于根元素字体大小

7. 解释下面代码的作用?为什么要加引号? 字体里\5b8b\4f53代表什么?
   body{ font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif; }

• 页面字体大小为12px，行高为1.5倍，后面为字体得优先级，选择顺序
• 加引号因为中间有空格，不加会被当作两种字体
• \5b8b\4f53代表宋体