CSS用法及介绍

最新推荐文章于 2023-04-07 08:07:14 发布

小寒不憨

最新推荐文章于 2023-04-07 08:07:14 发布

阅读量1.4k

点赞数

文章标签： css

本文链接：https://blog.csdn.net/m0_64109217/article/details/123058531

版权

1.CSS介绍

2.CSS的用法

3.CSS技术

1、CSS介绍
CSS通常我们称之为CSS样式或层叠样式表。
CSS的样式：给HTML标签添加需要展示的效果（可以理解为外观）
层叠：使用不同的添加方式，给同一个HTML标签添加样式，最后所有的样式都叠加到一起，共同作用于该标签。
CSS的作用：主要用于设置HTML页面中的文本内容（字体、大小、对其方式等）、图片的外形（高宽、边框样式、边距等）以及版面的布局等外观显示样式。简单来讲，CSS可以让HTML页面更美观。

2、CSS的用法
使用HTML时，需要遵从一定的规范。CSS亦如此，要想熟练的使用CSS对网页进行修饰，首先需要了解CSS样式规则。具体格式如下:

选择器 {
属性1 : 属性值;
属性2 : 属性值;
。。。
}

在上面的样式规则中，“选择器”用于指定CSS样式作用的HTML对象，花括号内是对该对象设置的具体样式。属性和属性值以键值对方式出现，使用英文冒号“:”分隔。多个属性之间使用英文分号“;”分隔。例如：

<style>
h2{
color : red ;
font-size : 100px ;
}
</style>

我们在书写CSS样式时，除了要遵循CSS样式规则，还必须注意CSS代码结构中的几个特点，具体如下：
1） CSS样式“选择器”严格区分大小写，“属性”和“属性值”不区分大小写。
2）多个属性之间必须用英文状态下的分号隔开，最后一个属性后的分号可以省略，但是，为了便于增加新样式最好保留。
3）如果属性的值由多个单词组成且中间包含空格，则必须为这个属性值加上英文状态下的引号。
4）在编写CSS代码时，为了提高代码的可读性，通常会加上CSS注释，例如：
这是CSS注释文本,此文本不会显示在浏览器窗口中
属性的值和单位之间是不允许出现空格的，否则浏览器解析时会出错。

3.CSS技术

CSS定义的规则具体如下：

选择器{属性1：属性值1；属性2：属性值2；属性3：属性值3；}
CSS样式的引用方式

引用CSS的方式由四种，分别是链入式、行内式（也称为内联样式）、内嵌式和导入式。

1>内嵌式

内嵌式是将CSS代码集中写在HTML文档的<head>头部标记中，并用<style>标记定义，其基本语法格式如下：

<head>
    <style type="text/css">
          选择器{属性1：属性值1；属性2：属性值2；属性3：属性值3}
    </style>
</head>

2>链入式

链入式是将所有的样式放在一个或多个以.css为扩展名的外部样式表文件中，通过<link />标记将外部样式表文件连接到HTML文件中，其基本语法格式如下：

<head>
    <link href="CSS 文件的路径" type"text/css" ref="stylesheet" />
</head>

CSS选择器和常用属性

标记选择器：标记选择器是指用HTML标记名称作为选择器，按标记名称分类，为页面中某一类标记指定统一的样式。其基本语法格式如下：

标记名{属性1：属性值1；属性2：属性值2；属性3：属性值3；}
类选择器：类选择器使用"."，进行标识，后面紧跟类名，其基本语法格式如下：

.类名{属性1：属性值1；属性2：属性值2；属性3：属性值3；}

id选择器：id选择器使用“#”进行标识，后面紧跟id名，其基本语法格式如下：

#id名{属性1：属性值1；属性2：属性值2；属性3：属性值3；}
通配符选择器：通配符选择器用"*"号表示，它是所有选择器中作用范围最广的，能匹配页面中所有的元素，其基本语法格式如下：

*{属性1：属性值1；属性2：属性值2；属性3：属性值3；}

小寒不憨

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
CSS用法及介绍

目录1.CSS介绍2.CSS的用法3.CSS技术1、CSS介绍 CSS通常我们称之为CSS样式或层叠样式表。 CSS的样式：给HTML标签添加需要展示的效果（可以理解为外观）层叠：使用不同的添加方式，给同一个HTML标签添加样式，最后所有的样式都叠加到一起，共同作用于该标签。 CSS的作用：主要用于设置HTML页面中的文本内容（字体、大小、对其方式等）、图片的外形（高宽、边框样式、边距等）以及版面的布局等外观显示样式。简单来讲，CSS...
复制链接

扫一扫