css样式
1 css样式属性
#1.1 样式重置（初始化样式）
*{margin：0；padding：0；}
1.2 常用属性
color--文字的颜色
line-height--行高会文本在行高中垂直居中
background-color:设置背景颜色
text-align:设置文本的对齐方向
font-size:设置字体大小
h1{cursor: pointer;} 滑到位置有鼠标箭头变成小手
1.3 元素水平居中
margin-left: auto;
margin-right: auto;
2 常用的css样式选择器
p{} 元素选择器 慎重使用
.class{} 特点： 1.可以给多个标签相同的class名
2.可以给一个标签多个class名
#id{} 特点：每个id名都是唯一的
--写样式的时候不要用id选择器
element:hover
如：h1:hover{}伪类选择器 合并（h1:hover,h2:hover）
（滑动效果是对h1整体的 如ul是对ul中所有的li，非单个li）
3 标签
3.1img 图片标签
特殊：单标签
src--标签的属性
功能:指定图片所在的位置
alt--当图片加载不出来,用来描述图片的
图片大小与容器大小一致，设置图片宽度
3.2 术语标签
<dl> -- 定义列表
<dt>HTML</dt> -- 定义的术语
<dd>负责网页的结构</dd> -- 定义的描述
</dl>
盒子模型
1.margin 改变元素位置
2.border 改变元素的 高度，宽度
3.padding 填充 改变元素 宽度，高度，
- width+padding=实宽
margin:0; //四个方向都改变
margin:0 10px; //top,bottom为0px;left,right为10px
margin:0 10px 20px; //top 0;left,right 10px;bottom 20px;
问题
1.背景图片
background-image: url(images/timg2.jpg)
2.边框设置
border: 1px solid skyblue;
3 样式选择及框架布局
- 尽量少用p{} 慎用id 多用class
