css网站布局实录学习笔记第二部分XHTML与CSS基础

2020-04-30 14:53:01易采站长站整理

选择符   指伪对象
CSS内置了几个标准的伪类,可用于样式定义。

除了链接样式控制的:link, :hover, :active, :visited几个伪类之外,其他伪类及伪对象在实际使用中并不常见。

2.6.9 通配选择符

通配是指使用字符来替代不确定的内容。所谓通配选择符,就是指可以使用模糊制定的方式来对对象进行选择。CSS通配选择符可以使用*作为关键字,使用方法如下:

复制代码
* {
color: blue;
}

*号表示所有对象,包含所有id及class的XHTML标签。使用如上选择符进行样式定义时,页面中的所有对象都会应用color: blue;来设置字体的颜色。

注:CSS选择符的优先级:记住一句话,控制越精细,优先级越高!

2.7 CSS数据单位

CSS提供了许多类型的数学单位,以便帮助设计师进行数值的定义。

2.8 应用CSS到网页中

2.8.1 行间样式表

行间样式表是指将CSS样式编码写在XHTML标签之中,类似如下格式:

复制代码
<h1 style=”font-size: 12px; color: #000FFF; font-weight: normal”>…</h1>

在此极力反对这样做。罕见样式表仅仅是XHTML标签对style属性的支持,并不符合表现与内容分离的设计原则。因此应当完全杜绝这种CSS编写方式。此方法只是在需要调试CSS样式的时候,临时使用还行。

2.8.2 内部样式表

内部样式表与行间样式表的相似之处在于,都是将CSS样式代码写在页面之中。不同的是,前者可以将样式表统一放置在一个固定位置上。将CSS代码写在<style>标签内。

内部样式表是CSS样式编码的初级应用形式,但不是推荐的编写方式,它只能针对当前页面有效,不能跨越页面执行,因此达不到CSS代码重用的目的。

2.8.3 外部样式表

外部样式表是CSS应用中最好的一种形式,它将CSS样式代码单独放在一个外部文件中,再由网页进行调用。多个网页可以调用同一个样式表文件,这样能够实现代码的最大限度重用及网站文件的最优化配置,这是最为推荐的编码方式。

复制代码
<link rel=”stylesheet” href=”xxx.css” tyle=”text/css” />

通过在XHTML代码中,在<head>下使用<link>标签来调用外部样式表文件。将link制定为stylesheet方式,并使用href=""指明样式表文件的路径。

2.9 样式优先权问题

由于存在3中不同的样式表导入方式,以及各种种类繁多的样式选择符。因此,在CSS设计中,样式优先问题不容忽视。

2.9.1 写法优先权

从样式写入的位置来看,它们的优先级依次是: