CSS常见属性一

1、行内元素与块级元素

a)块级元素占据一整行，行内元素不会，行内元素可以在同一行内水平展开
b)块级元素可以包含块级元素以及行内元素，行内元素只能包含行内元素
c)行内元素设置宽高无效，padding argin上下无效左右有效
d)块级元素可以设置宽高，行内元素宽高只与内容有关
常见块级元素：div p h1~h6 ol ul li dl dd dt table form section article ...
常见行内元素：span input button label textarea img ...

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

CSS继承：父元素设置的属性，子元素自动具有的属性为继承属性
可继承的属性：字体相关的一般可以继承，例如color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction、letter-spacing、word-spacing、white-space、line-height、list-style....
不可继承属性：display、margin、border、padding、background、height、min-height、max-height、width、min-width、max-width、position、left、right、top、bottom、z-index、float....

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

居中问题参看另一篇博客
居中小结

4、 用 CSS 实现一个三角形

#triangle {
  width:0;
  height:0;
  border-left:20px solid transparent;
  border-right:20px solid transparent;
  border-top:20px solid transparent;
  border-bottom:20px solid blue;
}

5、单行文本溢出加 ...

.ellipsis {
  white-space: nowrap;
  overfolw: hidden;
  text-overflow: ellipsis;
}

6、px, em, rem 有什么区别

px: 像素尺寸，相对于屏幕分辨率而言的；
em: 相对于父元素的尺寸倍数；
rem: 相对于HTML根元素的尺寸倍数；

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

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

a)设定字体大小、行高和字体类型；
b)加引号是因为有空格，如果没有引号，会按多个字体处理；
c)\5b8b\4f53代表宋体。

8、实现简单效果

简单效果一
简单效果二
简单效果三
三角形实现
卡片阴影效果