CSS

最新推荐文章于 2024-07-03 17:59:27 发布

ilgfcyll

最新推荐文章于 2024-07-03 17:59:27 发布

阅读量113

点赞数

分类专栏： CSS

本文链接：https://blog.csdn.net/ilgfcyll/article/details/103206952

版权

CSS 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

一、什么是CSS

CSS是层叠样式表
样式定义了如何显示HTML元素
样式存储在样式表中
外部样式能够极大提高工作效率
外部样式表存储在.css文件中
多个样式可以层叠为一。

二、样式表层叠的优先级

1浏览器缺省
2、外部样式
3、内部样式（存储在head标签中）
4、内联样式（位于HTML元素中）

三、CSS语法规则

CSS语法规则主要由两部分组成：选择器、多条声明语句

四、选择器的分类

CSS选择器主要分为四大类：

组合选择器——之间用“，”隔开
h1,h2,h3,h4,h5,h6 {
  color: green;
}
————————————————————————————————————————————————————————————————————————————————
派生选择器----之间用空格隔开
li strong {
    font-style: italic;
    font-weight: normal;
  }
————————————————————————————————————————————————————————————————————————————————
id选择器----用#代表是id选择器，后面跟着id的名字
<html>
<head>
<style type="text/css">
#intro {font-weight:bold;}
</style>
</head>

<body>
<p id="intro">This is a paragraph of introduction.</p>

<p>This is a paragraph.</p>

<p>This is a paragraph.</p>

<p>This is a paragraph.</p>

<p>...</p>
</body>
</html>
————————————————————————————————————————————————————————————————————————————————
类选择器----“.”代表使用类选择器，‘.’后面紧接着类名
<html>
<head>
<style type="text/css">
.important {color:red;}
</style>
</head>

<body>
<h1 class="important">This heading is very important.</h1>

<p class="important">This paragraph is very important.</p>

<p>This is a paragraph.</p>

<p>This is a paragraph.</p>

<p>This is a paragraph.</p>

<p>...</p>
</body>
</html>