• 技术文章 >web前端 >前端问答

    css中id选择符的标识是什么

    青灯夜游青灯夜游2022-09-22 15:57:51原创485

    在css中,id选择符的标识是“#”,可以为标有特定id属性值的HTML元素指定特定的样式,语法结构“#ID值 {属性 : 属性值;}”。ID属性在整个页面中是唯一不可重复的;ID属性值不要以数字开头,数字开头的ID在Mozilla/Firefox浏览器中不起作用。

    大前端零基础入门到就业:进入学习

    本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

    id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。

    HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 "#" 来定义。

    语法结构如下:

    #ID {
      属性 : 属性值;
    }

    下面的两个id选择器,第一个可以定义元素的颜色为红色,第二个定义元素的颜色为绿色:

    1.png

    下面的HTML代码中,id属性为red的p元素显示为红色,而id属性为green的p元素显示为绿色:

    2.png

    值得注意的是:

    id选择器和派生选择器

    在现代布局中,id选择器常常用于建立派生选择器。

    3.png

    上面的样式只会应用于出现在id是sidebar的元素内的段落,这个元素很可能是div或者是表格单元,尽管它也可能是一个表格或者其他块级元素。它甚至可以是一个内联元素,比如<em></em>或者<span></span>,不过这样用法是非法的,因为不可以在内联元素<span>中嵌入<p>。

    一个选择器多种用法

    即使被标注为sidebar的元素只能在文档中出现一次,这个id选择器作为派生选择器也可以被使用很多次:

    4.png

    在这里,与页面中其他p元素明显不同的是,sidebar内的p元素得到了特殊的处理,同时,与页面中其他所有h2元素明显不同的是,sidebar中的h2元素也得到了不同的特殊处理。

    单独的选择器

    id选择器即使不被用来创建派生选择器,它也可以独立发挥作用:

    5.png

    根据这条规则,id为sidebar的元素将拥有一个像素宽的黑色点状边框,同时其周围会有10个像素宽的内边距(padding,内容空白)。老版本的windows/IE浏览器可能会忽略这条规则,除非你特别地定义这个选择器所属的元素:

    6.png

    (学习视频分享:web前端

    以上就是css中id选择符的标识是什么的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。

    前端(VUE)零基础到就业课程:点击学习

    清晰的学习路线+老师随时辅导答疑

    自己动手写 PHP MVC 框架:点击学习

    快速了解MVC架构、了解框架底层运行原理

    专题推荐:css 选择器
    上一篇:css选择器不可以是标签的名字吗 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • ❤️‍🔥共22门课程,总价3725元,会员免费学• ❤️‍🔥接口自动化测试不想写代码?• css伪选择器学习之伪元素选择器解析• css伪选择器学习之伪类选择器解析• 一文详解css中的UI状态伪类选择器• 一文详解Javascript类选择器方法• 十六路数据选择器的地址输入端有几个
    1/1

    PHP中文网