09-id选择器


迟到毁一生

早退穷三代

按时上下班

必成高富帅

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>09-id选择器</title>

    <style>

        #identity1{

            color: red;

        }

        #identity2{

            color: green;

        }

        #identity3{

            color: blue;

        }

        #identity4{

            color: yellow;

        }

    </style>

</head>

<body>

<!--

1.什么是id选择器?

作用: 根据指定的id名称找到对应的标签, 然后设置属性

格式:

#id名称{

    属性:值;

}

注意点:

1.每个HTML标签都有一个属性叫做id, 也就是说每个标签都可以设置id

2.在同一个界面中id的名称是不可以重复的

3.在编写id选择器时一定要在id名称前面加上#

4.id的名称是有一定的规范的

4.1id的名称只能由字母/数字/下划线

a-z 0-9 _

4.2id名称不能以数字开头

4.3id名称不能是HTML标签的名称

不能是a h1 img input ...

5.在企业开发中一般情况下如果仅仅是为了设置样式, 我们不会使用id ,因为在前端开发中id是留给js使用的

-->

<p id="identity1">迟到毁一生</p>

<p id="identity2">早退穷三代</p>

<p id="identity3">按时上下班</p>

<p id="identity4">必成高富帅</p>

</body>

</html>

H5 id选择器的更多相关文章

  1. H5 id选择器和class选择器

    11-id选择器和class选择器 第一段文字 第二段文字 第三段文字 --> 第一段文字 第二段文字 第三段文字 <!DOCTYPE html> <html lang=&qu ...

  2. CSS 简介、语法、派生选择器、id 选择器、类选择器、属性选择器

    CSS 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与表现 ...

  3. id选择器、类选择器、属性选择器

    在网页编辑时,通常要对样式进行各种设置.我们借助CSS样式设计中的选择器,就能很好很方便的对它们进行管理和设置了. 今天,跟大家分享一下几个常用的选择器:id选择器.类选择器.属性选择器. id选择器 ...

  4. CSS选择器中类和ID选择器的区别

    类和ID选择器的区别 学习了类选择器和ID选择器,我们会发现他们之间有很多的相似处,是不是两者可以通用呢?我们不要着急先来总结一下他们的相同点和不同点: 相同点:可以应用于任何元素不同点: 1.ID选 ...

  5. JQuery中的id选择器含有特殊字符时，不能选中dom元素

    1.jquery类库在我们实际项目中用的很多,大家经常需要根据控件的id,获取对应的html元素.但是:当id含有特殊字符的时候,是不能选中的 2.jquery的id选择器只支持,单词.阿拉伯数字.下 ...

  6. CSS id 选择器

    id 选择器 id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式. id 选择器以 "#" 来定义. 下面的两个 id 选择器,第一个可以定义元素的颜色为红色,第二 ...

  7. CSS类选择器和ID选择器

    CSS类选择器和ID选择器皆允许以一种独立于文档元素的方式来指定样式,同时二者皆区分大小写. 区别如下: 第一:在同一个页面内,不允许有相同名字的id对象出现,但是允许相同名字的class 第二:当页 ...

  8. CSS ID选择器(三)

    一.ID选择器 ID选择器使用"#"前缀标识符进行标识,后面紧跟指定的元素的ID名称. 如 #box{ width:100px; height:100px;} 元素的ID名称是唯一 ...

  9. css笔记10：多个id选择器/类选择器包含相同部分问题的探讨

    有些时候,我们可以将多个class选择器或者id选择器,html选择器的共同部分提取出来,写在一起,这样的好处是是可以简化css文件 1.首先我们先看一段代码.css,如下: @charset &qu ...

随机推荐

  1. [20181116]18c DML 日志优化.txt

    [20181116]18c DML 日志优化.txt 1.环境:xxxxxxxx> select banner_full from v$version;BANNER_FULL---------- ...

  2. lua时间戳和日期转换及踩坑

    介绍lua的日期函数常用方法及我的一个踩坑. 时间戳转日期 os.date("%Y%m%d%H",unixtime) --os.date("%Y%m%d%H", ...

  3. xp,windows7,windows8,windows10那个系统好用些

    Windows XP:这曾经是微软史上最好的.最受欢迎.最受好评的可以说空前绝后的系统,虽然,XP系统对电脑配置的要求很低,基本现在所有的电脑都支持安装该系统,可它太老旧了,到2014年4-5月份微软 ...

  4. MATLAB求马氏距离(Mahalanobis distance)

    MATLAB求马氏距离(Mahalanobis distance) 作者:凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/ 1.马氏距离计算公式 d2(xi,  ...

  5. java操作elasticsearch实现query String

    1.CommonTersQuery: 指定字段进行模糊查询 //commonTermsQuery @Test public void test35() throws UnknownHostExcept ...

  6. jdk旧版本下载

    如何找到旧版本的jdk: 1.去oracle官网关于下载jdk的这一板块,https://www.oracle.com/technetwork/java/javase/downloads/index. ...

  7. Java面试知识点之计算机网络篇（一）

    前言:在Java面试中,计算机网络的知识也是一项重点,因此笔者在此对计算机网络的相关知识进行总结. 1.OSI参考模型 自下而上:物理层(物理介质,比特流).数据链路层(网卡.交换机).网络层(IP协 ...

  8. WPF DataGrid 列宽填充表格方法

    WPF中使DataGrid 列宽填充表格方法,设置ColumnWidth属性为ColumnWidth="*"即可. 源码: <DataGrid AutoGenerateCol ...

  9. 属性复制方法，当属性名字不一致时候可以传入匹配的Map

    /** * @param src * @param dest * @param filedMapping the diffrent fieldName mapping,key is src filen ...

  10. sql 查询所有子节点示例

    每天学习一点点 编程PDF电子书.视频教程免费下载:http://www.shitanlife.com/code <!-- 查询机构的所有子机构 --> <select id=&qu ...