关于网页中标签的id、class属性
1. 网页中任何一个标签都可以有id属性
id=identity,标识
标签加入id属性用于快速标识这个标签所在位置，也就是定位一个标签的过程，通常用于js代码和css设置。
语法： <标签 ID=”id名”>
id属性名称不区分大小写。
同一个网页内，id名不能重复2. 除了head, html, meta,title等标签，网页中任何一个标签都可以有class属性
class标签就是类，相当于使该标签从属于该类。
类名是自己起的，跟变量名的命名规则基本相同。
类名相同的标签属于同一个类
一个标签可以同时属于多个类
语法：
<标签 class=”类名 [类名]”>
一个标签可以同时属于多个类，多个类名之间用空格隔开即可
class属性跟id属性用法类似，不过通常用于一次对若干标签进行操作关于style属性
1、 style，样式。可用于所有标签，作用是改变其外形。若干样式并列，就组成了样式表css
2、 有行内样式表、内部样式表、外部样式表三种写法
3、 行内样式表语法
<标签A style = ”
属性1：值1;
属性2：值2;……
属性n：值n;
” >
CSS的概念
1、 CSS＝Cascade Style Sheet
级联 样式 表
2、 CSS的作用是 美化、修饰页面的各个标签
3、 CSS可以直接在HTML网页文件使用
也可以作为一个独立的.css文件使用
4、 即便CSS直接写在网页文件中也是一个独立工作部分
在写style时，可以加入网页注释
1、 网页的注释，对网页输出无影响
2、 网页的注释，对css的style中的代码也无影响
3、 写注释的目的的
以防style有特殊字符，>,>=,<,<=,&等符号出现
这些特殊符号出现后，有可能错误的解释，使页面混乱
4、 如果style代码中，无特殊字符，这个注释的存在就没什么意义。但以防万一，还是写上最好
CSS选择器的3个选择符
1、 类选择符，class 选择符
以“.”开头
.myCss1{
。。。
}
2、 id选择符
选择符名称以”#”开头
没有可视化绑定方法，只能手工在标签上加入id属性
#myId1{
。。。
}
3、 固定标签选择符
css变量名称前面没有任何标识(.,#)
这个名称必须是一个己存在的标签
div{
。。。
}
span{
。。。
}
需要注意的是，当你用不同的方式选中同一个标签，设置相同的样式时，这些选择方式是有优先级区别的，优先级排列为：行内样式表>内部样式表>外部样式表
而在内部样式表和外部样式表中，id选择符 >类选择符 >标签选择符
当你在多个地方对同一标签设置了同一样式时，优先级较高的设置会生效
关于CSS的级联表示方法，父子级联方法
1、 CSS的级联内含
父标签――＞ 子标签 ――＞ ……――＞继续
一级级缩小范围
2、 css级联表示语法
第1级css选择器 第2级css选择器 第n级css选择器{
css属性1：值1;
css属性2：值2;
css属性n：值n;
}
3、 上面每个级联的名称之间是一个英文空格，或多个英文空格
4、 级联时每个css名称可以3种选择器之一，可以交叉混合使用
关于多个CSS选择器同时定义方法，用一个逗号隔开
1、 含义
每一个css选择器可以独立设计
多个CSS选择器共享同一段样式表
2、 语法
第1个css选择器,第2css选择器,第n个css选择器{
css属性1:值1;
css属性2:值2;
css属性n:值n;
}
3、 表示上面css定义同时作用于这里定义的所有css选择器
4、 每一个css选择器可以独立设计，也可以不存在
一个标签可以属于多个类
方法就是在class属性中多写几个类，用空格分开，例如：
<div class=”myclass1 myclass2 myclass3 ……”></div>
这样写的话，这个div就同时属于这几个类，用这几个类作为选择器来设置的样式，全都会对这个div生效
类选择器的特殊用法
用级联写法时，类选择器前面是否有空格，意思是不同的。
div .a1{←注意div和.a1之间有空格，这是选中所有div标签中，有a1这个类的子标签，不管这些子标签是什么种类
div.a1{←注意div和.a1之间没有空格，这是选中所有div标签中，有a1这个类的div标签，跟有没有子标签无关，但必须是div标签
有空格是普通的级联写法，没空格则是选择所有该标签中，有这个类的那部分。
关于css的display属性
1、 display是页面布局的关键属性之一
2、 他的值有
display:none; --不显示，隐藏，如同不存在，页面布局会被改变
display:; --显示
display:block; --块元素，意思是可以设置宽度高度，同时在标签后面会自动换行，类似div
display:inline-block; --内联块元素，意思是可以设置宽度高度，同时在标签后面不会自动换行
display:inline; --内联元素，意思是不能设置宽度高度，同时在标签后面不会自动换行，类似span关于css的visibility属性
1、 是页面布局的关键属性之一
2、 让一个标签对象不显示， 在屏幕上占的空间还在
3、 语法 visibility:hidden;
关于css的margin属性
1、 margin,外边沿
2、 内含
一个标签的外部四边空间，本标签的外边沿
关于css的padding属性
1、 表示当前标签的内部子标签与边框的距离
类似于table的cellpadding属性
关于css的border属性
1、 表示四边框显示，包括
宽度
线的显示格式（点线，实线，点划线，，，）
线的颜色
每个边可以独立控制
可以四边同时控制
关于背景色与背景图片冲突问题
1、 任何一个标签可以用背景色，也可以用背景图片，如果2者同时存在，背景图优先
关于背景图片定位方法
1、 背景图片可以x,y方向的移位
2、 语法
background-repeat:no-repeat;（设置不重复，效果类似桌面背景的“平铺”）
background-position:左右水平方向移位 上下垂直方向移位;
数值为负时，从上方或左边截掉这么多像素。
数值为正时，往文字显示方向移位。水平方向，向右移；垂直方向，向下移。
这个移动是以父标签的左上角作为坐标原点的
该定位的效果优先于其他类似效果。
注意，必须先加入背景图片，才能写是否重复、定位等属性，如果顺序颠倒过来是无效的，例如：
background-repeat:no-repeat;
background-position:top;
background-image:url(bg.JPG);
按照这样顺序写，前两项样式设置是无法生效的，因为背景图是在后面引入的