css基础（三）

1. 行内元素与块级元素

常见块级元素

div h1 h2 h3 h4 h5 h6 hr p ul li address form ul ol dl hr menu table fieldset

常见行内元素

a span img em strong br img input label select textarea cite

行内元素与块级元素的特性

• 块级元素会充满整个父元素，可以设置宽度、高度，会计元素可以设置marging和padding。每个块级元素独占一行。
• 行内元素可以设置左右的maging。可以使用padding撑开行内元素的高度和宽度，但是不能影响父元素的高度和宽度。
• inline-block：将对象呈递为内联对象，但是对象的内容作为块对象呈递。。

2. CSS继承——哪些属性可以继承，哪些不能

css继承：父元素设置样式后，子元素的样式与父元素样式相同。
可继承元素：列表相关（list），文字相关（font），文本相关（text）

不可继承元素：display，width，padding，marging，height

• 更多

3. 实现居中

块级元素居中：
设置宽度后，marging-left:auto;marging-right:auto;

行内元素居中：
使用代码：text-align:center

4. CSS实现三角形

将内容区width: 0;height: 0;，再在元素的一条边上加上较粗的边框，即可显示如一个三角形的样子。
例

5. 单行文本溢出变为……

white-space: nowrap; 文本空间：不折叠
overflow:hidden; 超出部分：隐藏
text-overflow:ellipses; 文本超出：省略号

6. px em rem

px:像素，固定宽度，
em:相对单位，相对于父元素或自身设定的字体大小
rem: 相对于HTML（body）的字体大小

** 问题：**解释下面代码的作用?为什么要加引号? 字体里\5b8b\4f53代表什么?

body{
  font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
}

两个单词表示一种字体时，使用引号包裹表示这两个单词一起解读。
'\5b8b\4f53'表示宋体，在国外查看该网站时，浏览器也许不能解读'宋体'中文字体。使用'\5b8b\4f53'能让浏览器正确解析。

** 效果实现 **
—1—
—2—
—3—
—4—
—5—