1. 块级元素和行内元素分别有哪些?动手测试并列出4条以上的特性区别
块元素 | 行内元素 |
---|---|
div | span |
p | i em strong b |
h1-h6 | img |
form | a |
ul ol dl li dd dt | button input label |
table tr td th | select textarea |
特征区别:
块级元素 | 行内元素 |
---|---|
可以包含块级元素和行内元素 | 只能包含行内元素 |
占据一整行 | 只占本身宽度 |
能自定义宽高 | 不能定义宽高 |
有内外边距 | 只有左右边距 |
2. 什么是 CSS 继承? 哪些属性能继承,哪些不能?
- 继承,它是依赖于祖先-后代的关系的,它允许样式不仅可以应用于某个特定的元素,还可以应用于它的后代。就是没有特别设置时,儿子会继承父级的一些属性样式。
继承属性 | 无继承属性 |
---|---|
visibility | 盒子模型属性:width,height,margin,padding,border |
文本属性:text-indent,text-align,line-height,word-spacing,letter-spacing,color | 定位属性:float,position,clear,top,right,left,bottom,overflow,z-index |
文本属性:font-size,font-weight,font-style,font-family | 文本属性:vertical-align,text-decoration,text-shadow,white-space |
cursor | display,background |
3. 如何让块级元素水平居中?如何让行内元素水平居中?
- 块级元素:margin: 0 auto;
- 行内元素:text-align:center;
5. 单行文本溢出加 ...如何实现?
- overflow:hidden;超出部分隐藏
- text-overflow:ellipsis;显示省略符号来代表被修剪的文本。
- white-space:nowrap;不折行
6. px, em, rem 有什么区别
- px:像素,相对于显示器屏幕分辨率而言
- em:相对长度单位,相对于当前对象文本字体尺寸而言,若未设置,则相对于浏览器默认文本尺寸,默认尺寸为16px
- rem:rem为元素设定字体大小时,仍然是相对大小,但相对的只是HTML根元素(html)
7. 解释下面代码的作用?为什么要加引号? 字体里\5b8b\4f53代表什么?
body{
font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
}
body元素里的子元素设置字体大小为12px,行高为字体大小的1.5倍,后面都是字体,依次查询浏览器和本地的字体库里有没有相关字体,没有的话就查询下一个字体。加引号表示引号里面的是一个字体,是一个整体,'\5b8b\4f53是Unicode码,代表字体转换为Unicode码
8.代码
(mission8)