1.什么是CSS,CSS是如何工作的
CSS是层叠样式表用来样式化和排版你的网页的,例如更改网页内容的字体、颜色、大小等等
当浏览器显示文档时,他必须将文档的内容与其样式信息结合,它分两个阶段处理文档,第一个是浏览器将HTML和CSS转化为DOM(文档对象模型),DOM把文档内容和其样式结合在一起,第二是浏览器显示DOM的内容。
2.CSS的基本语法是怎样的
CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明:
选择器通常是您需要改变样式的 HTML 元素。
每条声明由一个属性和一个值组成。 属性(property)是您希望设置的样式属性(style attribute)。每个属性有一个值。属性和值被冒号分开,分号;结尾。例如color:#fff; 文本颜色为白色
3.CSS选择器是什么概念,简单选择器和属性选择器是什么
选择器用于定位我们想要样式化的网页HTML元素。
简单选择器(Simple selectors):通过元素类型、class 或 id 匹配一个或多个元素。
属性选择器(Attribute selectors):通过 属性 / 属性值 匹配一个或多个元素。
属性选择器是一种特殊类型的选择器,它根据元素的 属性和属性值来匹配元素。它们的通用语法由方括号([]) 组成,其中包含属性名称,后跟可选条件以匹配属性的值。
·第一类存在和值属性选择器
[attr]:该选择器选择包含 attr 属性的所有元素,不论 attr 的值为何。
[attr=val]:该选择器仅选择 attr 属性被赋值为 val 的所有元素。
[attr~=val]:该选择器仅选择 attr 属性的值(以空格间隔出多个值)中有包含 val 值的所有元素,比如位于被空格分隔的多个类(class)中的一个类。
HTML文件·第二类子串值属性选择器
[attr|=val] : 选择attr属性的值是 val 或值以 val- 开头的元素(-用来处理语言编码)。
[attr^=val] : 选择attr属性的值以val开头(包括 val)的元素。
[attr$=val] : 选择attr属性的值以val结尾(包括 val)的元素。
[attr*=val] : 选择attr属性的值中包含字符串 val 的元素。
伪选择器(Pseudo-classes):匹配处于确定状态的一个或多个元素,伪选择器 。该选择器不是选择元素,而是元素的某些部分,比如被鼠标指针悬停的元素,或当前被选中或未选中的复选框,或元素是DOM树中一父节点的第一个子节点。分为伪类和伪元素。
· 伪类(pseudo-class) 是一个以冒号(:)作为前缀的关键字,比如a:hover代表鼠标悬停在a标签上的样式是如何。
HTML文件 css文件 未点击之前·伪元素前缀是两个冒号 (::) , 同样是添加到选择器后面去选择某个元素的某个部分。
伪元素组合器(Combinators):这里不仅仅是选择器本身,还有以有效的方式组合两个或更多的选择器用于非常特定的选择的方法。例如,你可以只选择divs的直系子节点的段落,或者直接跟在headings后面的段落。
A,B 匹配满足A(和/或)B的任意元素(参见下方 同一规则集上的多个选择器).
A B 匹配任意元素,满足条件:B是A的后代结点(B是A的子节点,或者A的子节点的子节点)
A > B 匹配任意元素,满足条件:B是A的直接子节点
A + B 匹配任意元素,满足条件:B是A的下一个兄弟节点(AB有相同的父结点,并且B紧跟在A的后面)
A ~ B 匹配任意元素,满足条件:B是A之后的兄弟节点中的任意一个(AB有相同的父节点,B在A之后,但不一定是紧挨着A)
例如:
设计链接的样式,但是只针对ul无序列表中的链接有效;
设计ul列表里的链接样式,但是只当鼠标停留在上面时有效;
设计只紧接着最大标题下的段落样式。
所以相关css文件:
css文件多用选择器(Multiple selectors):这些也不是单独的选择器;这个思路是将以逗号分隔开的多个选择器放在一个CSS规则下面, 以将一组声明应用于由这些选择器选择的所有元素。
多用选择器4.文本样式都有哪些相关属性,对应哪些值
文本颜色:color,值有16进制的如:#fff;有rgb(255,0,255),有颜色的名称,如red
文本对齐方式:文本排列属性是用来设置文本的水平对齐方式。文本可居中center或对齐到左left或右right,两端对齐.当text-align设置为"justify",每一行被展开为宽度相等,左,右外边距是对齐(如杂志和报纸)。h1 {text-align:center;}p.date {text-align:right;}p.main {text-align:justify;}
文本修饰:text-decoration 属性用来设置或删除文本的装饰。从设计的角度看 text-decoration属性主要是用来删除链接的下划线:a {text-decoration:none;}
文本转换来指定在一个文本中的大写和小写字母。可用于所有字句变成大写或小写字母,或每个单词的首字母大写。p.uppercase {text-transform:uppercase;}p.lowercase {text-transform:lowercase;}p.capitalize {text-transform:capitalize;}
文本缩进用来指定文本的第一行的缩进。p {text-indent:50px;}
css中的文本样式属性
网友评论