CSS基本选择器

最新推荐文章于 2024-02-28 21:36:57 发布

bryn_li

最新推荐文章于 2024-02-28 21:36:57 发布

阅读量208

点赞数 1

分类专栏：其他收藏文章标签： css Web前端

其他收藏专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>基本选择器</title>
<style type='text/css'>
/*
1.基本选择器
a.标签选择器:指的就是选择器的名字代表html页面上的标签
p{
color:red ;
border:1px dashed green;
}

b.类选择器：规定用圆点.来定义
优点：灵活
eg: .one{background-color:#ff0099; }

c. ID选择器：规定用#来定义
eg: #one{cursor:hand; }

区别：标签选择器针对的是页面上的一类标签.
类选择器可以供多种标签使用.
ID选择器是值供特定的标签(一个). ID是此标签在此页面上的唯一标识。

d:通用选择器：用*定义,代表页面上的所有标签。
*{
font-size:30px;
margin-left:0px;
margin-top:0px;
}
*/

.one{
border :1px solid red;/* 实线*/
}
#two{
border :3px dashed green;/* 虚线*/
}

*{
font-size:30px;
margin-left:0px;
margin-top:0px;
color:#ff6699;
}
</style>
</head>
<body>
<div class='one'>萌萌哒</div>
<div class='one'>羞羞哒</div>
<div >可爱的</div>
<p class='one'>哇哈哈哈</p>
<h1 id='two'>QQ糖</h1>
</body>
</html>