一：全局选择器：*

二：标签选择器，如给所有p标签加个背景色

三：id选择器：# ，如给id为id_01的元素加一个框

四：类选择器：. 如设置一个类选择器为blue，当有标签引用blue的时候，背景颜色就会变为蓝色

css

/* 全局选择器*，即所有 */
*{ color: red;}

/* 标签选择器，如给所有p标签加个背景色 */
p {background-color: blueviolet;}

/* id选择器：# ，如给id为id_01的元素加一个框*/
#id_01{ border: solid 5px #000;}

/* 类选择器：. 如设置一个类选择器为blue，当有标签引用blue的时候，背景颜色就会变为蓝色*/
.blue{background-color: blue;}

html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>CSS</title>
    <!-- 引用../css/css03.css文件 -->
    <link rel="stylesheet" href="../css/css03.css">
</head>
<body>
    <h1>*为全局选择器，文字为红色</h1>
    <p>这是标签选择器，p标签背景色为紫色</p>
    <p id="id_01">这是带id元素的标签</p>
    <p class="blue">这是类选择器，blue元素，背景颜色会变为蓝色</p>
</body>
</html>

测开之路九十一：css常用的选择器的更多相关文章

  1. 测开之路四十一：常用的jquery函数

    jQuery选择器菜鸟教程:https://www.runoob.com/jquery/jquery-selectors.html 引用jquery2.1.1标签:<script src=&qu ...

  2. 测开之路九十三：css之文字样式和段落对齐

    引用css 字体族 字体类型和尺寸 em:字体按倍数缩放 font-weight:调整文字的粗细 段落对齐:text-align 左对齐:left 右对齐:right 居中对齐:center 两边对齐 ...

  3. 测开之路九十：css的引用方式

    第一种:内联,直接在标签里面加style属性,优先级别最高,但是不利于维护 第二种:页面嵌入,在head标签里面写一个style标签,以类选择器的形式写入,优先级别第二 第三种:外联,样式表链接,单独 ...

  4. 测开之路六十一：接口测试平台之interface蓝图

    create的js //添加header的函数function add_header() { // 这里是动态拼接html语句,带着样式,拼凑成页面的 "key [] value []&qu ...

  5. 测开之路九十七：js的引用方式

    第一种:引用外部js文件 准备一个js文件 <!-- 引用外部的js --><script src="../js/js01.js"></script& ...

  6. 测开之路八十一：参数定义之*args和**kwargs

    # *,不定长参数,*args# 定义函数参数def avg(score, *scores):    return (score + sum(scores)) / (len(scores) + 1) ...

  7. 测开之路七十一：监控平台之js

    监控平台的js //datetimepicker的初始化函数(主要是对选择时间的下拉框)function init_datetimepicker() { //初始化格式和规则 $('#start'). ...

  8. 测开之路五十一：代码实现MongoDB增删改查

    初始化时连接.析构时断开连接 from pymongo import MongoClient class Mogo(object): def __init__(self, host='127.0.0. ...

  9. 测开之路三十一：Flask基础之请求与相应

    from flask import requestrequest.pathrequest.methodrequest.formrequest.argsrequest.values 一般用form获取p ...

随机推荐

  1. 【论文解读】[目标检测]retinanet

    作为单阶段网络,retinanet兼具速度和精度(精度是没问题,速度我持疑问),是非常耐用的一个检测器,现在很多单阶段检测器也是以retinanet为baseline,进行各种改进,足见retinan ...

  2. mysql复习(1)基本CRUD操作

    一.这段时间在学校,把之前的东西都好好捡起来. 0.下面介绍Mysql的最基本的增删改查操作,很多IT工作者都必须掌握的命令,也是IT面试最常考的知识点.在进行增删改查之前,先建立一个包含数据表use ...

  3. js/nodejs导入Excel相关

    导入示例如下: Excel可设置单元格的数字显示格式,特别的,常规格式下,会根据列宽缩进显示. 实际中,有时需要导入实际值,有时需要导入显示值. 而B2的显示值,由于跟列宽相关,目前未找到任何软件,可 ...

  4. 新建maven子模块 出现 Unable to read parent POM

    新建maven子模块 出现 Unable to read parent POM错误 于是把pom.xml文件中的 中文字符全部删除 包括 注释 最后成功建立

  5. Java 应用中的日志

    frankiegao123 芋道源码 日志在应用程序中是非常非常重要的,好的日志信息能有助于我们在程序出现 BUG 时能快速进行定位,并能找出其中的原因. 但是,很多介绍 AOP 的地方都采用日志来作 ...

  6. [转]0day零距离

    前言: 想起这个话题,还要从早年网上的一则新闻说起--"美国联邦官员于2001年12月11日宣布,已破获一起以因特网为犯罪手段的特大软件盗版案--盗版软件的总价值至少高达10亿美元.据悉,该 ...

  7. svn 命令行使用总结

    1.上传项目到SVN服务器上 svn import project_dir(本地项目全路径) http://192.168.1.242:8080/svn/IOS/Ben/remote_dir(svn项 ...

  8. SpringCloud学习系列-构建部门微服务提供者Module

    1.新建microservicecloud-provider-dept-8001 2.POM <project xmlns="http://maven.apache.org/POM/4 ...

  9. c++ string去除左右空格

    res.substr(res.find_first_not_of(' '),res.find_last_not_of(' ') + 1)

  10. js去重的es6做法和es5做法

    1.es5做法var array=[1,3,4,5,2,3,4,5,5,5];var ob={};var result=[];array.forEach(function (a) { var key= ...