本文主要讲述:元素选择器,id选择器,类选择器
HTML源码如下:
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Document</title>
<!--
style一共有三种不同的用法,分别是在标签内部,内联样式,和外部样式表。
-->
<!--
这是外部样式表,使用link标签对外部的css文件进行引用,
-->
<link rel="stylesheet" href="./day_1.css">
</head>
<body>
<h1>标题</h1>
<p id="o1">少小离家老大回</p>
<p class="green abcc">乡音无改鬓毛衰</p>
<p id="abcd">落霞与孤鹜齐飞</p>
<p>秋水共长天一色</p>
<p>爆竹声中一岁除</p>
<p style="color: aqua;font-size: 40px;">贪污和浪费是极大的浪费</p>
<p>天地不仁,以万物为邹狗</p>
<!--
创建一个锚点,用#则回到页面的最上面位置,若用#id则到达id所在的位置,
-->
<a href="##">aaa</a>
<a href="#o1">o1</a>
<a href="js:;">aaa</a>
<a href="#">aaa</a>
</html>
通用选择器:
/* 元素选择器:
作用:根据标签来选中指定的元素
语法:标签名{属性值}
*/
/* p{
color: #550223;
height: 140px;
}
*/
id选择器:
/*
ID选择器:
作用:根据元素的id选中元素来更改元素的属性值
语法:#id{属性值更改}
例如:#abcd
*/
/* #abcd{
color:#482912;
font-size: 90px;
}
*/
类选择器:
/* 类选择器:
作用:根据class的属性值选中一组元素
语法:.class{属性值}
*/
/* .abcc{
color: aquamarine;
font-size: 50px;
} */