一：全局选择器：*

二：标签选择器，如给所有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. 虚拟机的linux（CentOS）系统安装

    一.安装虚拟机:VirtualBox  1.软件下载:https://www.virtualbox.org/  2.一路点击下一步完成安装 二.安装linux:CentOS6.8  1.官方网站:ht ...

  2. 关于websocket 在生产环境中遇到的问题 及 解决办法

    一  生产环境说明 1) tornado 4.2 2) Tornado-MySQL 3) supervisor 3.0b2 4) protobuf 2.6.1 5) python 2.7.6 6) n ...

  3. JavaScript的循环结构和经典题目

    一.JS中的循环结构 循环结构的执行步骤1.声明循环变量:2.判断循环条件;3.执行循环体操作:4.更新循环变量:5.然后循环执行2-4,直到条件不成立,跳出循环. while循环()中的表达式,运算 ...

  4. editplus的使用技巧

    数据库sql语句中的 in 后面需要 ('xx','bb')这样的结果,多的话修改起来就比较麻烦,这时候使用editplus 的替换功能就可以实现 ,顶部菜单的 搜索 - > 替换 或者 ctr ...

  5. Linux--用户与用户组--03

    用户管理: 1.useradd 创建用户 -c 指定用户描述 -d 指定家目录 -g 指定主组 -G 指定附加组 附加组可以有多个 -s 指定shell程序 特殊的/sbin/nologin--> ...

  6. Python变量类型及变量

    python是解释性语言 什么是解释性语言 就相当于你去饭店,你点了10道菜,他做好1道给你上1道.解释一行,执行一行.速度上不如编译性语言快. 什么是编译性语言 就相当于去饭店吃饭,你点了10道菜, ...

  7. 2--面试总结-深入理解js线程进阶-宏任务微任务

    前言:Event Loop即时间循环,是指浏览器或Node的一种解决javascript单线程运行时不会阻塞的一种机制,也就是我们经常使用异步的原理 Js运行机制      1.不同运行环境,js运行 ...

  8. php内置函数分析之array_column()

    PHP_FUNCTION(array_column) { zval *zcolumn = NULL, *zkey = NULL, *data; HashTable *arr_hash; zval *z ...

  9. 用递归将嵌套的JSON对象遍历出来，转为二维数组 或一维数组

    var map = new Array();//二维数组 var map2 = new Array();//一维数组 for (var i = 0; i < e.Data.length; i++ ...

  10. 缓存promise技术不错哦

    1. pageManager.js const promiseList = {}; module.exports = { putData: function(pageName,data){ promi ...