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中的标签选择器.$()中的 ...
随机推荐
- ramfs 和 tmpfs 以及 ramdisk相关调研
最近需要使用到 ramfs 和 tmpfs 做内存文件系统,下面对这两个文件系统相关的信息,做一下总结: 参考链接: https://www.thegeekstuff.com/2008/11/over ...
- Android程序中,内嵌ELF可执行文件-- Android开发C语言混合编程总结
前言 都知道的,Android基于Linux系统,然后覆盖了一层由Java虚拟机为核心的壳系统.跟一般常见的Linux+Java系统不同的,是其中有对硬件驱动进行支持,以避开GPL开源协议限制的HAL ...
- 使用java代码操作Redis
1导入pom.xml依赖 <dependency> <groupId>redis.clients</groupId> <artifactId>jedis ...
- go语言设计模式之Concurrency future
future.go package future type SuccessFunc func(string) type FailFunc func(error) type ExecuteStringF ...
- 新书上线:《Spring Boot+Spring Cloud+Vue+Element项目实战:手把手教你开发权限管理系统》,欢迎大家买回去垫椅子垫桌脚
新书上线 大家好,笔者的新书<Spring Boot+Spring Cloud+Vue+Element项目实战:手把手教你开发权限管理系统>已上线,此书内容充实.材质优良,乃家中必备垫桌脚 ...
- React中添加注释
React中的注释,其实确切来讲是jsx中的注释: {/*单行注释*/} {/* 多 行 注 释 */}
- IDEA创建maven项目慢的不行
方法二 下载archetype-catalog.xml文件,在maven的VM Options加上-DarchetypeCatalog=local 默认情况下,创建maven项目是从网络下载catal ...
- Educational Codeforces Round 76 (Rated for Div. 2) B. Magic Stick 水题
B. Magic Stick Recently Petya walked in the forest and found a magic stick. Since Petya really likes ...
- 推荐一款好用到爆的开源 Java 诊断工具
Arthas是什么鬼?Arthas是一款阿里巴巴开源的 Java 线上诊断工具,功能非常强大,可以解决很多线上不方便解决的问题. Arthas诊断使用的是命令行交互模式,支持JDK6+,Linux.M ...
- Spring Cloud Zuul 那些你不知道的功能点
本文摘自于 <Spring Cloud微服务 入门 实战与进阶> 一书. 1. /routes 端点 当@EnableZuulProxy与Spring Boot Actuator配合使用时 ...