Html学习之六(CSS选择器的使用--基础选择器的使用)
一、基础选择器
1.id选择器
2.class选择器
3.元素选择器
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>id选择器</title>
<style>
#text{
font: "微软雅黑";
color: red;
}
</style>
</head>
<body>
<h1 id="text">长恨歌 </h1>
<h3 id="text">作者:白居易</h3>
<p id="text">
《长恨歌》是唐代诗人白居易的一首长篇叙事诗。全诗形象地叙述了唐玄宗与杨贵妃的爱情悲剧。诗人借历史人物和传说,创造了一个回旋宛转的动人故事,并通过塑造的艺术形象,再现了现实生活的真实,感染了千百年来的读者,诗的主题是“长恨”。该诗对后世诸多文学作品产生了深远的影响。
</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>class选择器</title>
<style>
.red-text{
font: "微软雅黑";
color: red;
}
</style>
</head>
<body>
<h1 class="red-text">长恨歌 </h1>
<h3 class="red-text">作者:白居易</h3>
<p class="red-text">
《长恨歌》是唐代诗人白居易的一首长篇叙事诗。全诗形象地叙述了唐玄宗与杨贵妃的爱情悲剧。诗人借历史人物和传说,创造了一个回旋宛转的动人故事,并通过塑造的艺术形象,再现了现实生活的真实,感染了千百年来的读者,诗的主题是“长恨”。该诗对后世诸多文学作品产生了深远的影响。
</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>元素选择器</title>
<style>
h1{color: blue;}
p{
font: "微软雅黑";
color: red;
}
</style>
</head>
<body>
<h1>长恨歌 </h1>
<h3>作者:白居易</h3>
<p>
《长恨歌》是唐代诗人白居易的一首长篇叙事诗。全诗形象地叙述了唐玄宗与杨贵妃的爱情悲剧。诗人借历史人物和传说,创造了一个回旋宛转的动人故事,并通过塑造的艺术形象,再现了现实生活的真实,感染了千百年来的读者,诗的主题是“长恨”。该诗对后世诸多文学作品产生了深远的影响。
</p>
</body>
</html>
Html学习之六(CSS选择器的使用--基础选择器的使用)的更多相关文章
- Html学习之七(CSS选择器的使用--基础选择器优先级问题)
二.基础选择器的综合使用 优先级顺序:id选择器>class选择器>元素选择器.也就是说,如果这三种选择器同时为某一个元素设定样式,那么冲突的部分按优先级的顺序依次决定. <!DOC ...
- css的导入与基础选择器
css是什么 css也是一门标记语言,主要用作修改控制html的样式 css书写的位置(导入) css是用来控制页面标签的样式,但是可以根据实际情况书写在不同的位置, 放在不同位置有不同的专业叫法,可 ...
- 【CSS简介、基础选择器、字体属性、文本属性、引入方式】前端小抄(2) - Pink老师自学笔记
[CSS简介.基础选择器.字体属性.文本属性.引入方式]前端小抄(2) 本学习笔记是个人对 Pink 老师课程的总结归纳,转载请注明出处! 一.CSS简介 CSS 的主要使用场景就是布局网页,美化页面 ...
- CSS简介,基础选择器,字体属性,文本属性
欢迎大家去博客冰山一树Sankey,浏览效果更好.直接右上角搜索该标题即可 博客园主页:博客园主页-冰山一树Sankey CSDN主页:CSDN主页-冰山一树Sankey 前端学习:学习地址:黑马程序 ...
- 深入学习jQuery选择器系列第一篇——基础选择器和层级选择器
× 目录 [1]id选择器 [2]元素选择器 [3]类选择器[4]通配选择器[5]群组选择器[6]后代选择器[7]兄弟选择器 前面的话 选择器是jQuery的根基,在jQuery中,对事件处理.遍历D ...
- 学习总结:CSS(一)定义方式、选择器、选择器权重
一.CSS的定义方式 1.内部样式:<style></style> 2.行间样式:<div style="width:100px;height:100px;&q ...
- html 选择器之基础选择器
我把CSS选择器分开成三部分,第一部分是我们常用的部分,我把他叫做基本选择器:第二部分我把他称作是属性选择器,第三部分我把他称作伪类选择器 一.基础选择器 1. 通配符(*):选中所有的元素 2.元素 ...
- WEB学习-CSS基础选择器
基础选择器 标签选择器 就是标签的名字. • <h1>前端与移动开发<span>1期班</span>基础班</h1> css: • <style ...
- jQuery学习笔记(一)——基础选择器、过滤选择器、表单选择器
$()就是jQuery中的函数,它的功能是获得()中指定的标签元素.如演示样例中$("p")会得到一组P标签元素,当中"p"表示CSS中的标签选择器.$()中的 ...
随机推荐
- 201871010116-祁英红《面向对象程序设计(java)》第十四周学习总结
博文正文开头格式:(2分) 项目 内容 <面向对象程序设计(java)> https://home.cnblogs.com/u/nwnu-daizh/ 这个作业的要求在哪里 https:/ ...
- acwing 848 有向图的拓扑序列
地址 https://www.acwing.com/problem/content/description/850/ 题目描述给定一个n个点m条边的有向图,图中可能存在重边和自环. 请输出任意一个该有 ...
- Scrum会议(第十一周)
十一周会议 1.任务分配: github相关代码 2.会议记录: 总结并阐述了自己在上周存在的问题以及解决了自己把自己的issue发在了自己的github,并没有把问题发在我们项目小组的项目的issu ...
- Codeforces Round #599 (Div. 2) B1. Character Swap (Easy Version) 水题
B1. Character Swap (Easy Version) This problem is different from the hard version. In this version U ...
- Java反射简单使用--第一次细致阅读底层代码
1:所写的东西都经过验证,保证正确,环境jdk8,eclipse2:在例子中,尽量以生产环境中实际代码为例,那种固定值什么的没什么意义 问题: 1:想获取调用方法所需要的参数 2:参数是以json形式 ...
- SpringBoot系列之profles配置多环境(篇二)
SpringBoot系列之profles配置多环境(篇二) 继续上篇博客SpringBoot系列之profles配置多环境(篇一)之后,继续写一篇博客进行补充 写Spring项目时,在测试环境是一套数 ...
- C# 使用Json.NET对数据进行序列化和反序列化 | c# json serialize and deserialize using json.net JsonConvert
本文首发于个人博客https://kezunlin.me/post/22391aa3/,欢迎阅读最新内容! c# json serialize and deserialize using json.n ...
- oracle自定义函数:将使用点分隔符的编码转成层级码格式的编码
维护一个旧的系统,表设计中只有编码,而没有其他排序相关的字段,然后根据编码排序出现了顺序错乱的问题. 详细地说,其编码设计是使用[.]分隔符的编码,比如1.1.1.1.1.1.1.1.1.2这样的格式 ...
- 数据库——SQL SERVER Transact-SQL 程序设计
什么是Transact-SQL? 标准SQL不支持过程化控制, 不能完成复杂的功能.T-SQL是过程化SQL语言, 是SQL的扩展 增加了过程化语句 (变量,赋值,分支,循环...)是数据库服务器 ...
- Elastic:用Docker部署Elastic栈
安装 因为我们需要使用docker来进行安装,我们必须安装: docker:根据不同的操作系统,请按照要求安装docker.可以到网站https://docs.docker.com/去安装 docke ...