网页设计css 第1篇
要使用CSS对HTML页面中的标签实现一对一，一对多的控制，这就需要用到CSS选择器。
语法：标签名{} 通过标签选择器可以选择页面中的所有指定标签
语法：.class属性值{} 通过标签的class属性值选中一组标签
我是一个段落
我也是一个段落
语法：#id属性值 {} 通过标签的id属性值选中唯一的一个标签
我是一个段落
我也是一个段落
语法：*{} 可以用来选中页面中的所有的标签
我是一个段落
我也是一个段落
网页设计css 第2篇
层叠 继承 优先级 是我们学习CSS 必须掌握的三个特性。
所谓层叠性是指多种CSS样式的叠加。
是浏览器处理冲突的一个能力,如果一个属性通过两个选择器设置到同一个元素上，那么这个时候一个属性就会将另一个属性层叠掉
比如先给某个标签指定了内部文字颜色为红色，接着又指定了颜色为蓝色，此时出现一个标签指定了相同样式不同值的情况，这就是样式冲突。
一般情况下，如果出现样式冲突，则会按照CSS书写的顺序，以最后的样式为准。
所谓继承性是指书写CSS样式表时，子标签会继承父标签的某些样式，如文本颜色和字号。想要设置一个可继承的属性，只需将它应用于父元素即可。
简单的理解就是： 子承父业。
注意：
定义CSS样式时，经常出现两个或更多规则应用在同一元素上，这时就会出现优先级的问题。
在考虑权重时，初学者还需要注意一些特殊的情况，具体如下：
关于CSS权重，我们需要一套计算公式来去计算，这个就是 CSS Specificity，我们称为CSS 特性或称非凡性，它是一个衡量CSS值优先级的一个标准 具体规范入如下：
specificity用一个四位的数 字串(CSS2是三位)来表示，更像四个级别，值从左到右，左面的最大，一级大于一级，数位之间没有进制，级别之间不可超越。
比如的例子：
注意： 数位之间没有进制 比如说： 0,0,0,5 + 0,0,0,5 =0,0,0,10 而不是 0,0, 1, 0， 所以不会存在10个div能赶上一个类选择器的情况。
总结优先级：
网页设计css 第3篇
我是一个段落
当鼠标没接触到
标签时： 鼠标移入时：
opacity 属性设置标签的不透明级别 值为1。
规定不透明度：从 （完全透明）到 （完全不透明）。
语法：opacity：; 冒号后面填写0-1之间的数字即可
● 什么是块级标签？
块级标签：无论内容多少 都会独自占据一行的。
例如
● 什么是行级标签？
行级标签：只占自身大小的标签，不会占一行。
例如、、
● 什么是行级块标签？
例如 等
那么我们能否对不同级别标签进行转换呢？答案是肯定的！
通过display样式可以修改标签的类型。 可选值： block ：设置标签为块标签 inline ：设置标签为行级标签 inline-block ：设置标签为行级块标签 none ：隐藏标签（标签将在页面中完全消失）
我是一个段落
没进行display修改前：（可以清晰的观察到，独占一行）
进行修饰后：（只占自身大小）
网页设计css 第4篇
CSS 可以添加背景颜色和背景图片，以及来进行图片设置。
语法：
参数：
none : 无背景图（默认的） url : 使用绝对或相对地址指定背景图像
background-image 属性允许指定一个图片展示在背景中（只有CSS3才可以多背景）可以和 background-color 连用。 如果图片不重复地话，图片覆盖不到地地方都会被背景色填充。 如果有背景图片平铺，则会覆盖背景颜色。
小技巧： 我们提倡 背景图片后面的地址，url不要加引号。
语法：
参数：
repeat : 背景图像在纵向和横向上平铺（默认的）
no-repeat : 背景图像不平铺
repeat-x : 背景图像在横向上平铺
repeat-y : 背景图像在纵向平铺
设置背景图片时，默认把图片在水平和垂直方向平铺以铺满整个元素。
repeat-x : 背景图像在横向上平铺
repeat-y : 背景图像在纵向平铺 设置背景图片时，默认把图片在水平和垂直方向平铺以铺满整个元素。
语法：
参数：
length : 百分数 | 由浮点数字和单位标识符组成的长度值。请参阅长度单位 position : top | center | bottom | left | center | right
说明：
设置或检索对象的背景图像位置。必须先指定background-image属性。默认值为：(0% 0%)。 如果只指定了一个值，该值将用于横坐标。纵坐标将默认为50%。第二个值将用于纵坐标。
注意：
实际工作用的最多的，就是背景图片居中对齐了。
语法：
参数：
scroll : 背景图像是随对象内容滚动 fixed : 背景图像固定
说明： 设置或检索背景图像是随对象内容滚动还是固定的。
background属性的值的书写顺序官方并没有强制标准的。为了可读性，建议大家如下写：
background:背景颜色 背景图片地址 背景平铺 背景滚动 背景位置
CSS3支持背景半透明的写法语法格式是:
最后一个参数是alpha 透明度 取值范围 0~1之间
注意： 背景半透明是指盒子背景半透明， 盒子里面的内容不收影响。
同样， 可以给 文字和边框透明 都是 rgba 的格式来写。
通过background-size设置背景图片的尺寸，就像我们设置img的尺寸一样，在移动Web开发中做屏幕适配应用非常广泛。
其参数设置如下：
a) 可以设置长度单位(px)或百分比（设置百分比时，参照盒子的宽高）
b) 设置为cover时，会自动调整缩放比例，保证图片始终填充满背景区域，如有溢出部分则会被隐藏。
c) 设置为contain会自动调整缩放比例，保证图片始终完整显示在背景区域。
以逗号分隔可以设置多背景，可用于自适应布局
网页设计css 第5篇
阅读报纸时容易发现，虽然报纸中的内容很多，但是经过合理地排版，版面依然清晰、易读。同样，在制作网页时，要想使页面结构清晰、有条理，也需要对网页进行“排版”。
“版心”是指网页中主体内容所在的区域。一般在浏览器窗口中水平居中显示，常见的宽度值为960px、980px、1000px、1200px等。
为了提高网页制作的效率，布局时通常需要遵守一定的布局流程，具体如下：
1、确定页面的版心（可视区）。
2、分析页面中的行模块，以及每个行模块中的列模块。
3、制作HTML页面，CSS文件。
4、CSS初始化，然后开始运用盒子模型的原理，通过DIV+CSS布局来控制网页的各个模块。
最普通的，最为常用的结构
比如小米 小米官网
比如锤子 锤子官网
网页设计css 第6篇
行内样式表,又有人称内联样式、行间样式、内嵌样式。是通过标签的style属性来设置元素
样式，其基本语法格式如下：
<标签名 style=_属性1:属性值1; 属性2:属性值2; 属性3:属性值3;_> 内容 标签名>
我是一个段落
效果如下：
内嵌式是将CSS代码集中写在HTML文档的head头部标签中，并且用style标签定义
我是一个段落
其效果同上，这里需要注意：中的
标签修饰对
标签内容都有效
外部样式表是将所有的样式放在一个或多个以.CSS为扩展名的外部样式表文件中，通过link标签将外部样式表文件链接到HTML文档中
（其中，href中填写引入的样式文件）