任务8——CSS常见样式
2017-06-21 本文已影响0人
upup_dayday
1.块级元素和行内元素分别有哪些？
- 区别1
块级元素可以包含块级元素和行内元素；行内元素只能包含文本和行内元素 - 区别2
块级元素独占一行，行内元素只占据自身宽度空间； - 区别3
块级元素可是设置过宽高，行内元素不能设置宽高 - 区别4
块级元素可以设置margin，padding，行内元素只能设置水平的margin，padding，竖直方向的不生效
2.什么是 CSS 继承? 哪些属性能继承，哪些不能？
CSS继承指的是特定的CSS样式向下传递到子孙元素。
- 不可继承的特性
不可继承的：display、margin、border、padding、background、height、min-height、max- height、width、min-width、max-width、overflow、position、left、right、top、 bottom、z-index、float、clear、table-layout、vertical-align、page-break-after、 page-bread-before和unicode-bidi。 - 可以继承的特性
所有元素可继承：visibility和cursor。
内联元素可继承：letter-spacing、word-spacing、white-space、line-height、color、font、 font-family、font-size、font-style、font-variant、font-weight、text- decoration、text-transform、direction。
块状元素可继承：text-indent和text-align。
列表元素可继承：list-style、list-style-type、list-style-position、list-style-image。
表格元素可继承：border-collapse。
引用自：css中可以和不可以继承的属性 by四眼闷
3.如何让块级元素水平居中？如何让行内元素水平居中?
- 块级元素居中
.box{
margin-left:auto;
margin-right:auto;
}
- 行内元素水平居中
.box{
text-align:center;
}
4.用CSS实现一个三角形
对块级元素设置宽高为0，设置上下左右border为不同颜色，或透明，可组合出不同样式三角形，调整border像素设置，可调整三角形的大小；
Paste_Image.png
5.单行文本溢出...的实现方法
white-space:nowrap ——显示不下的元素，不进行换行
overflow：hidden ——溢出的元素隐藏
text-overflow:ellipsis ——超出的部分用…代替
Paste_Image.png
6.px,em,rem有什么区别
- px
固定单位，按照像素来设置大小 - em
相对单位，是相对于父元素字体大小的相对值，2em为两倍 - rem
相对单位，是相对于字体大小的相对值；
7.解释下面代码作用
body{
font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
}
- font-size:12px;
- line-height:1.5;
- font-family:tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
字体样式写多个，是为避免浏览器上找不到该字体，而做的备选，如果找不到前面的字体会选择后面列的字体；
字体的样式，同一种有多种表达方法，加引号的目的是为了把单词联系在一起，表明一个完整的字体样式；
后面的数字字符，是直接把字体样式转换为了unicode码
