day3 4 （学习笔记）

day3 4 （学习笔记）

css常见样式

css 层叠样式表

三种使用方法（就近原则）

行内样式

内联式

外部样式

选择器

基本选择器

通配符选择器

能匹配页面中所有元素

标签选择器（元素选择器）

按标记名称分类，为页面中某一类标签指定统一的CSS样式

ID选择器

#id名

id名为HTML元素的id属性值，大多数元素都可以定义id属性，元素的id值是唯一的，只能对应文档中某一个具体元素

类选择器 （.box1）

.+类名

为元素对象定义单独或相同的样式，多个标记可以使用同一个类名，可以实现为不同类型的标记指定相同样式

群组选择器

可以同时对多个选择器进行相同的操作

div class=“box1” id=“box2”

2.包含选择器

子代选择器（> 亲生儿子）、后代选择器 （ 后代所有）

font- size font-weight font-style

3.逗号选择器

div.

p.

span{}

4.属性选择器

通过元素属性及属性值来选择元素

选择含有指定属性的元素

选择含有指定属性及指定属性值的元素

选择含有指定属性及指定属性之开头的元素

选择含有指定属性及指定属性值结尾的元素

选择含有指定属性，只要含有某个属性值的元素

input[type=“password”]

5.伪类选择器

用来描述一个元素的特殊状态

有只能用于超链接的样式

有针对所有标签都适用的样式

6.结构伪类选择器

针对HTML的结构进行分类的选择器，特征就是位置，分为三大类

child type 其他的

修饰

尺寸修饰

wdith

height

background-color

font-size

字体修饰

normal 正常

ltalic 斜体

oblique 倾斜

font-weight 粗细

文本修饰

color 颜色

text-align:center 文本对齐方式

text-decoration:none 文本的线

text-shadow 文本的阴影

line-height 行高

width

height

border 盒子边框

背景修饰

定位修饰

relative 相对定位

absolute 绝对定位

fixed 固定定位

浮动

float

会影响后面的标签布局，使用后需要清除

display

块标签

行标签

行内块

盒子模型

边框 border

内边距 padding

外边距 margin

动画

过渡

指定一个属性发生变化时的切换方式

创建一些非常好的效果

变形

通过css来改变元素的形状或位置

不会影响页面的布局

平移元素

缩放

图片放大和缩小

页面