一、基础选择器

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选择器的使用--基础选择器的使用）的更多相关文章

  1. Html学习之七（CSS选择器的使用--基础选择器优先级问题）

    二.基础选择器的综合使用 优先级顺序:id选择器>class选择器>元素选择器.也就是说,如果这三种选择器同时为某一个元素设定样式,那么冲突的部分按优先级的顺序依次决定. <!DOC ...

  2. css的导入与基础选择器

    css是什么 css也是一门标记语言,主要用作修改控制html的样式 css书写的位置(导入) css是用来控制页面标签的样式,但是可以根据实际情况书写在不同的位置, 放在不同位置有不同的专业叫法,可 ...

  3. 【CSS简介、基础选择器、字体属性、文本属性、引入方式】前端小抄(2) - Pink老师自学笔记

    [CSS简介.基础选择器.字体属性.文本属性.引入方式]前端小抄(2) 本学习笔记是个人对 Pink 老师课程的总结归纳,转载请注明出处! 一.CSS简介 CSS 的主要使用场景就是布局网页,美化页面 ...

  4. CSS简介，基础选择器，字体属性，文本属性

    欢迎大家去博客冰山一树Sankey,浏览效果更好.直接右上角搜索该标题即可 博客园主页:博客园主页-冰山一树Sankey CSDN主页:CSDN主页-冰山一树Sankey 前端学习:学习地址:黑马程序 ...

  5. 深入学习jQuery选择器系列第一篇——基础选择器和层级选择器

    × 目录 [1]id选择器 [2]元素选择器 [3]类选择器[4]通配选择器[5]群组选择器[6]后代选择器[7]兄弟选择器 前面的话 选择器是jQuery的根基,在jQuery中,对事件处理.遍历D ...

  6. 学习总结：CSS(一)定义方式、选择器、选择器权重

    一.CSS的定义方式 1.内部样式:<style></style> 2.行间样式:<div style="width:100px;height:100px;&q ...

  7. html 选择器之基础选择器

    我把CSS选择器分开成三部分,第一部分是我们常用的部分,我把他叫做基本选择器:第二部分我把他称作是属性选择器,第三部分我把他称作伪类选择器 一.基础选择器 1. 通配符(*):选中所有的元素 2.元素 ...

  8. WEB学习-CSS基础选择器

    基础选择器 标签选择器 就是标签的名字. • <h1>前端与移动开发<span>1期班</span>基础班</h1> css: • <style ...

  9. jQuery学习笔记（一）——基础选择器、过滤选择器、表单选择器

    $()就是jQuery中的函数,它的功能是获得()中指定的标签元素.如演示样例中$("p")会得到一组P标签元素,当中"p"表示CSS中的标签选择器.$()中的 ...

随机推荐

  1. 《算法问题实战策略》 BOGGLE

    oj地址是韩国网站 连接比较慢 https://algospot.com/judge/problem/read/BOGGLE大意如下 输入输出 输入 URLPM XPRET GIAET XTNZY X ...

  2. Nginx与keepalived实现高可用

    主keepalived设置 #安装keepalived [root@localhost ~]# yum -y install keepalived #安装nginx [root@localhost ~ ...

  3. 【C#】C#获取本地的内网(局域网)和外网(公网)IP地址的方法

    1.获取本机的IP地址集合: /// <summary> /// 获取本机所有ip地址 /// </summary> /// <param name="netT ...

  4. IT兄弟连 HTML5教程 HTML文件的主体结构

    每个页面都是一个独立的HTML文档,每个HTML文档的主体结构又都是相同的,而且在一个文档中这样的主体结构只能声明一次.可以简单的将HTML文档主体结构分为两部分,一部分是定义文档类型,HTML5中声 ...

  5. 《细说PHP》第四版 样章 第18章 数据库抽象层PDO 9

    18.7  PDO的事务处理 事务是确保数据库一致的机制,是一个或一系列的查询,作为一个单元的一组有序的数据库操作.如果组中的所有SQL语句都操作成功,则认为事务成功,那么事务被提交,其修改将作用于所 ...

  6. 使用paramiko模块进行封装，远程操作linux主机

    import time import paramiko class HandleParamiko: ''' 定义一个linux处理类 ''' def __init__(self, hostname, ...

  7. Selenium+java - 使用csv文件做数据驱动

    前言 早期我们使用TestNG 来做数据驱动进行测试,测试数据是写在测试用例脚本中.这会使得测试脚本的维护工作量很大.因此我们可以将测试的数据和脚本分开. 而我们经常使用会使用csv文件来做为导出数据 ...

  8. Docker容器 MySQL中文乱码解决方案

    docker exec进入容器 sudo docker exec -it 588340b778f6 bash 执行以下命令,将 character-set-server=utf8 写入mysql配置文 ...

  9. 【CF528E】Triangles 3000（计算几何）

    [CF528E]Triangles 3000(计算几何) 题面 CF 平面上有若干条直线,保证不平行,不会三线共点. 求任选三条直线出来围出的三角形的面积的期望. 题解 如果一定考虑直接计算这个三角形 ...

  10. bootstrap 自定义模态窗口

    $(".classname").click(function () { $('#mymodel').modal('show'); alert('模态框打开了'); }); $('# ...