css基础

1：
css的基本语法
selector{
property:value;
}
2:
css选择器
选择器
标签选择器---p{color:red;}


类别选择器--.center{text-algin:center;}第一个字母不能是数字


ID选择器----前面用#号来标志---#demo{color:red;}


伪类选择器
a:link{color:red}--当未被鼠标访问时
a:visited{color:red}--已被鼠标访问
a:hover{color:red}---鼠标在元素上方
a:active{color:red}--鼠标被激活时


------------
群组选择器
h1,h2,h3{color:red;}
-----
通用选择器
*{margin:0;padding:0;}
----
后代选择器
h1 em{
color:red;
}
---
子选择器
h1>strong{
color:red;
}
---
属性选择器
[title]{color:red;}
-----
提示css选择器有优先级的，id>class>标签
----------------
2：
css盒模型
整个盒模型在页面的宽度等于
左边界+左边框+左填充+内容+右填充+右边框+右边界
3：
在css中width和height指的是内容content区域的宽度和高度
增加内边距，边框和外边距不会影响内容区域的尺寸，但是会增加元素框的总尺寸
例子
假如框的每个边上有10px的外边距和5px的内边距
如果希望这个元素框达到100元素，就需要将内容的宽度设置为
70px
代码如下
#box{
width:70px;
margin:10px;
padding:5px;
}
4:
padding属性
padding属性设置元素边框和元素内容之间的空白区域
1：
padding:10px;---表示上下左右内边距都是10px
2:
padding:5px 10px;--表示上下为5px,左右为10px
3:
padding:5px 6px 7px;---表示上为5，下为7，左右均为6
4：
padding:5px 6px 7px 8px--表示上为5，右为6，下为7，左为8
注意：
padding不允许负值
------------------------------------
4：
border属性
img{
border:#cc 1px red;
}
提示:如果边框样式为0或者none，那么边框根本不存在
----------------
5：
margin属性
margin属性是指周围生成额外的空白区域
特性如下：
1:
margin始终是透明的
2：
margin值左右相加，上下塌陷
3：
margin可为负值
4：
margin值为auto时，盒子居中对齐
5：
margin语法结构和padding相似