ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

css的选择器

2021-01-13 12:35:44  阅读:83  来源: 互联网

标签:color 标签 id 2020 选择器 css 属性


<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			/*
			 * 
			 标签名选择器
			 给页面所有同名的标签定义样式的选择器
			 语法  标签名{样式}
			 * */
			span{
				background-color: skyblue;
				font-size: 40px;
				font-family: "楷体";
				color: orangered;
			}
			/*
			 id选择器
			 一般body中的任何一个标签都有id属性
			 id属性的值一般在同一个网页上是不允许有重复值
			 id属性一般用于帮助我们定位到页面上唯一的一个标签
			 id属性值命名有规则
			 不能有空格和一些特殊符号 
			 特殊符号中仅可以使用_   不推荐 $ 会和jquery命名冲突 
			 不能以数字为开头
			 推荐写法  应为字母开头 数字放在后面
			 语法: #id值{样式}
			 */
			#p1{
				border: 1px dotted blue;
				background-color: gray;
				color: red;
				width: 100px;
				height: 100px;
			}
			
			/*
			 类选择器
			 一般body中的所有标签都有class属性
			 多个不同的标签可以有相同的class属性值
			 通过标签的class属性确定样式的作用范围
			 语法  .class属性值{样式}
			 */
			.c1{
				background-color: cadetblue;
				font-size: 50px;
				font-family: "微软雅黑";
				color: black;
				text-decoration: none;
			}
			
			
		</style>
	</head>
	<body>
		<span id="s1">今天是2020年3月5日</span>
		<br />
		<span id="s2">今天是2020年3月5日</span>
		
		
		<p id="p1">今天是2020年3月5日</p>
		<p id="p2">今天是2020年3月5日</p>
		<p id="p3" class="c1">今天是2020年3月5日</p>
		<h1 id="ha" class="c1">今天是2020年3月5日</h1>
		<a href="#" class="c1">百度</a>
		
		
	</body>
</html>

  

标签:color,标签,id,2020,选择器,css,属性
来源: https://www.cnblogs.com/vincentmax/p/14271356.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有