[CSS]CSS添加方式、优先级、选择器、overflow、border、border-radius、box-shadow

一、使用CSS的方式

1.内联/行内样式:
  1. <divstyle="color:red;"></div>
2.内部样式表:定义在<head>中,对当前网页有效
  1. <style>
  2. div {
  3. color:red;
  4. }
  5. </style>
3.外部样式表:引入css文件
  1. <linkrel="stylesheet"type="text/css"href="style.css"/>
@charset "utf-8";
 
二、优先级
0:浏览器缺省设置
1:内部样式表 或 外部样式表
2:行内/内联样式
3:!important规则:放在属性值之后,用空格区分,优先级最高
 
三、选择器
1.元素/标记选择器
2.类选择器:.className{}
3.分类选择器:p.important{}
4.通用选择器:*{}
5.id选择器:#id{}
6.群组选择器:span,p,a{},用于定义公共样式
7.后代/包含选择器:div p{}
8.子代选择器:div>p
9.伪类选择器:链接伪类、动态伪类、目标伪类、元素状态伪类、结构伪类、否定伪类
 
四、选择器优先级
元素选择器:1
类/伪类选择器:10
ID选择器:100
内联样式:1000
 
五、尺寸单位
px、em:1em=当前字体的尺寸
 
六、尺寸属性
width,max-width,min-width
height,max-height,min-height
 
溢出:overflow
值:visible(默认值)、hidden、scroll、auto
overflow-x:横向溢出时的处理
overflow-y:纵向溢出时的处理
 
七、边框
border: width style color
透明色:transparent
 
边框圆角/倒角:border-radius:给定值,或百分比(border-radius制作特殊图形)
 
边框阴影:box-shadow,常用方式:
  1. box-shadow:0 0 1px #ddd;
 
posted @ 2017-05-04 15:00  enginex  阅读(196)  评论(0编辑  收藏  举报