css常见属性

块级元素和行内元素分别有哪些

• 块级元素block-level: div、h1/h2/h3.. p form ul ol
• 行内元素inline-level:span button input em script label

块级元素区别和行内元素区别

块级元素	行内元素
可以包含块级和行内元素	包含文字和行内元素
占据一整行的空间	占据自身宽度
可以设置margin padding	行内元素内外边距不生效
width height只对块级元素有效	width、height 对行内元素无效

css 属性继承（后续遇到了边学习继续总结）

css属性继承是指在内部的标签将拥有外部标签的样式性质，继承是一种机制，不仅可以用于某个特定的元素，还可以用于它的后代元素

可继承的属性	不可继承的属性
color	border
font(font-size、font-familye、font-weight、line-height)	text-decoration
text-align	display
text-indent	background
text-transform	height
word-spacing	position
letter-spacing	float
list-style	min-height、max-height

设置块级元素和行内元素居中

• 块级元素，只要设置左右的margin 为auto，margin:0 auto; 既可达到居中
• 行内元素，设置text-algin :center; 即达到居中。

用 CSS 实现一个三角形

http://js.jirengu.com/rilo/13/edit?html,output

单行文本溢出加 ...如何实现?

需要三个属性，white-space:nowrap; // 不折行
overflow:hidden; // 超出部分隐藏
text-overflow:ellipsis;变为...
http://js.jirengu.com/rilo/13/edit?html,output

px, em, rem 有什么区别

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

font-family

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

上述代码：设置字体大小为12px,行高是1.5，\5b8b\4f53 是字体对应的unicode 编码，加引号是因为 字体名字有空格，不加引号会被当成两个元素。
代码题：
1、http://js.jirengu.com/caha/1/edit
2、http://js.jirengu.com/paxox/1/edit
3、http://js.jirengu.com/tofad/1/edit
4、http://js.jirengu.com/pahu/1/edit
5、http://js.jirengu.com/sixoz/3/edit

总结任务八中的css属性

• font-size:字体大小
• font-family 字体（宋体、微软雅黑）
• font-weight 字体粗度（font-weight:bold；粗体）
• line-height:行高（文字占据的垂直空间）
• text-decoration 不可继承属性，可以延伸到子属性，但是标签a自带下划线，所以必须单独设置a标签来修改，不能直接通过 操作父元素来修改a标签。
• text-align:left/right/center/justify/ 对齐方式,相对父元素的对齐方式，并不能控制块级元素自己对齐，只能控制它的行内文本内容对齐；
• text-transform 可以设置文本全部大小或者全部小写，也可以设置单个的单词（capitalize、uppercase、lowercase）
• text-indent:规定了首行文本内容之前应该有多少水平空格
• text-decoration:none/line-through/overline/
• rgb(255,255,255) 白色 red green blue 所占百分比，255 为100%
  rgba(0,0,0,0.5) 0.5是透明度，从0-1，不能为负数，1是完全不透明
• box-shadow:以逗号分隔列表来描述一个或者多个阴影效果，可以用到几乎任何元素上，如果元素同时设置了border-radius,那么阴影也会有圆角效果
• border-collapse:用来决定表格的边框是分开还是合并的，collapse 使用合并的边框绘制表格，separate 分开的边框
• word-spacing 用于声明标签和单词直接的间距行为
• letter-spacing 明确了文字的间距行为
• list-style:属性是设置list-style-type、list-style-image、list-style-position 的简写属性。list-style:none 去掉li前的点
• position 选择定位元素的代替规则，
  static 指定元素使用正常的布局行为，即元素在文档流中当前的布局位置，此时设置top，right，bottom，left，z-index属性无效
  relative 元素先放置在未添加定位时的位置，在不改变页面布局的前提下调整元素位置，（因此会在此元素未添加定位时，所在位置留下的空白，）
  absolute 不为元素预留空间，通过制定元素相对于最近的非static定位祖先元素的偏移
  fixed不为元素预留空间，而是通过指定元素相对于屏幕视口（viewport）的位置来指定元素位置。元素的位置在屏幕滚动时不会改变。