(1)什么是css?
级联样式表 cascading stylesheet,为页面提供展现的方式（即数据以何种方式来显示）
(2)w3c推荐页面设计的标准
数据与结构：html
样式（外观）:css
行为:javascript
(3)css的基本语法
选择器{
属性名:属性值;
...
}
(4)选择器
A.标签选择器(选择器的名称是一个标签的名字)
标记的名称{
}
B. class选择器
.任意的名称{
}
或者
标记名称.任意的名称{
}
C.id选择器
#任意的名称{
}
(5)样式的继承
子标记会继承父标记的样式
(6)样式的优先级
内联样式>内部样式>外部样式
浏览器内部也有一个默认的样式
(7)重点的属性
文本相关的属性
font-size: 12px;/15px; //字体大小
font-weight:900 //磅 100-900 共9个数字
text-align:rigth center left
color:
背景相关的属性
background-color:#ff88ee;//背景
background-image:url(images/t1.jpg)//背景图片
background-repeat:no-repeat repeat-x repeat-y //平铺
background-attachment:fixed //固定
边框
border:1px solid red;//宽度 样式 颜色
border-left:
border-right:
border-top:
border-bottom:
位置
width:100px //宽度
height:100px //高度
margin: 10px 9px 8px 7px;//外边距
margin-left:7px;
margin-right:9px;
margin-top:10px
margin-bottom:8px;
margin:1px;//上，右，下，左都是1个像素
margin:20px auto;//上下各20px,左右居中
padding://内边距 有可能会将父元素撑大
padding-left:
padding-top:
padding-right:
padding-bottom:
padding:10px 9px 8px 7px;
块元素与行内元素：
块元素：
另起一行: h1..hn, p,div,form,ul/ol,li,img
行内元素:
在一行内：span
display属性：//元素的显示方式
none:不显示
block:以块元素的方式来显示
inline:以行内元素的方式来显示
position属性://元素的摆放方式
static://默认摆放,从左到右，从上到下。
absolute://按照父元素的位置偏移
relative://先按照默认方式摆放，然后偏移
float属性:
left://取消独占一行的特性，向左浮动。
text-decoration:none underline;//下划线
链接的伪样式:
a:link { color: red} 没有访问时
a:visited { color: blue} 访问后
a:active { color: lime} 鼠标点击但还没有放开时
a:hover { color: aqua} 鼠标指向时
(8)怎么样引入HTML:
<head>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
style.css是样式的文件。
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
