css(二)

64 阅读1分钟

一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第6天,点击查看活动详情

行内CSS样式:

-只对单个标签有效,它甚至不会影响整个文件,行内样式定义可以精确控制某个HTML元素的外观表现,并且允许通过Javascript动态修改HTML标签的CSS样式。 -为了使用行内样式,CSS扩展了HTML标签,几乎所有HTML标签都增加了一个style通用属性。style=“property:vlaue;property:value;”

属性选择器

从广义的角度来看,元素选择器 其实是属性选择器的特例。

属性选择器一共有如下几种语法格式:

E{} 指定该CSS样式对所有的E元素起作用。

E[attr]{};指定该CSS样式对具有attr属性的E元素起作用

E[attr=value]:指定该CSS样式对所有包含attr属性,且attr属性值为value的E元素起作用

E[attr~=value]:指定该CSS样式对所有包含attr属性,attr属性的值以空格隔开的
  系列值,其中某个值为value的E元素起作用

E{attr|=value}指定该CSS样式对所有包含attr属性,且Attr属性的值以连字符分隔
  的系列值。其中第一值为value的Tag元素起作用。

CSS选择器

定义CSS样式的语法格式:

Selector{
property1:value;
property2:value
}

第一部分: selector选择器
第二部分:{property:value}属性定义
CSS的内容分为两部分:选择器 属性

元素选择器 ID选择器 类选择器

image.png

关系选择符

包含选择符 (E F)
子选择符(E>F)
相邻选择符(E+F)
兄弟选择符(E~F)