基础训练讲解视频

核心提示层叠样式表是一种用来表现HTML或XML等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。CSS能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象

级联样式表(CSS)是一种用于表达HTML或XML等文件样式的计算机语言。CSS不仅可以静态修饰网页,还可以用各种脚本语言动态格式化网页的元素。

CSS可以在像素级别精确控制网页中元素的布局,支持几乎所有的字体样式,并具有编辑网页对象和模型样式的能力。

基本语言编辑

和属性值。

属性

属性的名称是合法的标识符,它们是CSS语法中的关键字。属性指定格式的一个方面。例如,颜色是文本的颜色属性,而text-indent指定段落的缩进。

要掌握一个属性的用法,有六个方面需要了解。详情如下:

①该属性的合法属性值。显然,段落缩进属性text-indent只能分配一个表示长度的值,而表示背景模式的background.image属性应该取一个表示图片位置链接的值,或者关键字none表示不使用背景模式。

②该属性的默认值。当该属性未在样式表单中指定并且无法从其父元素继承时,浏览器会将该属性视为其默认值。

③该属性适用的元素。有些属性只适用于某些单个元素,例如空白属性只适用于块级元素。空白属性可以有三个值:normal、pre和nowrap。选择normal时,浏览器将忽略连续的空白色字符,只显示一个空白色字符。选择pre时,会保留连续空白色字符。使用nowrap时,连续空白色字符会被忽略,并且不会自动换行。

④该属性的值是否被下一级继承。

⑤如果属性可以取百分比值,百分比值将如何解释?也就是百分比值的相对标准是什么。例如,margin属性可以取一个百分比值,它是容器相对于存储在margin中的元素的宽度。

⑥该属性所属的媒体类型组。

属性值

①整数和实数

这和一般意义上的整数和实数没有太大区别。CSS中只能使用浮点小数,而实数不能像其他编程语言一样用科学记数法表示,也就是1.2E3在CSS中会是非法的。下面是一些正确的例子,整数:128,-313,实数:12.20,1415,-12.03。

②长度数量

长度量由整数或实数加上相应的长度单位组成。长度通常用于定位元素。定位分为绝对定位和相对定位,所以长度单位也分为相对长度单位和绝对长度单位。

相对长度单位是:em-当前字体的高度,是font.size属性的值;ex-当前字体中小写字母X的高度;DX-像素的长度,实际长度由显示器的设置决定。

另一点值得注意的是,子元素不继承父元素的相对长度值,只继承它们的实际计算值。

③百分比数量

百分比是数字加上百分号。显然,百分比数量总是相对的,所以像相对长度数量一样,百分比数量不会被子元素继承。[10]

选择器

类型选择器

CSS中的选择器是元素类型的名称。使用这个选择器,声明可以应用到这个元素类型的每个实例。例如,以下简单规则的选择器是H1,因此该规则作用于文档中的所有H1元素:

H1 {颜色:红色}

简单属性选择器

类别属性

CLASS属性允许将声明应用于在CLASS属性上具有相同值的一组元素。主体中的所有元素都有一个CLASS属性。本质上,您可以使用class属性对元素进行分类,在样式表中创建规则来引用CLASS属性的值,然后浏览器自动将这些属性应用于这组元素。

类选择器以一个标识符开始,该标识符用于指示遵循哪种类型的选择器。对于类选择器,选择句点是因为它与许多编程语言中的术语“类”相关联。翻译成英文,符号的意思是“有类名的元素”。

ID属性

ID属性的操作类似于CLASS属性,但是有一个重要的区别:ID属性的值在整个文档中必须是惟一的。这允许ID属性用于为单个元素设置样式规则。包含ID属性的选择器称为ID选择器。

注意,ID选择器的标识符是一个散列符号。标识符用于提醒浏览器接下来会出现ID值。

样式属性

虽然CLASS和ID属性值可以在选择器中使用,但是STYLE属性实际上可以代替整个选择器机制。样式属性的值实际上是一个或多个CSS声明,而不是只有一个值可以在选择器中引用。

通常,使用CSS时,设计者会将所有的样式规则放在一个样式表中,该样式表位于文档顶部的STYLE元素中。但是,使用STYLE属性可以绕过样式表,将声明直接放在文档的开始标记中。

组合选择器类型

您可以将类型选择器、ID选择器和类选择器组合成不同的选择器类型,以形成更复杂的选择器。通过组合选择器,您可以更准确地处理想要给出某种表示的元素。例如,要组合类型选择器和类选择器,元素必须满足两个要求:它必须是正确的类型和正确的类,以便样式规则可以对其进行操作。

外部信息:伪类和伪元素

在CSS1中,样式通常基于HTML源代码中出现的标签和属性。这种方法对于很多设计场景来说是完全可行的,但是无法达到设计师想要的一些常见的设计效果。

设计伪类和伪元素可以实现其中的一些效果。这两种机制扩展了CSS的表达能力。在CSS1中,可以根据一些情况使用伪类来改变文档中链接的样式,比如链接是否被访问,何时被访问,用户如何与文档交互。借助伪元素,您可以更改元素首字母和首行的样式,或者添加源文档中没有出现过的元素。

HTML中既不存在伪类,也不存在伪元素;;也就是说,它们在HTML代码中是不可见的。这两种机制都经过精心设计,以便在CSS的后续版本中进一步扩展;也就是说达到更多的效果。

power node css基础视频教程详细讲解了什么是css。级联样式表(CSS)是一种用于表达HTML或XML等文件样式的计算机语言。CSS不仅可以静态修饰网页,还可以用各种脚本语言动态格式化网页的元素。CSS可以在像素级别精确控制网页中元素的布局,支持几乎所有的字体样式,并具有编辑网页对象和模型样式的能力。

动态节点CSS课程学习目录

1.CSS教程-CSS概述2。介绍CSS样式的三种方法的HTML概述。介绍CSS样式的三种方法的HTML概述。CSS教程-HTML第一次介绍CSS样式内联5。介绍CSS样式的第二种方式。id选择器标签选择器和类选择器7。CS的教程-HTML介绍CS S样式的第三种方式介绍外部独立的css文件8。CSS教程-列表样式9。CSS教程-绝对定位

 
友情链接
鄂ICP备19019357号-22