记录一下CSS选择器的效率从高到低的一个排序

最新推荐文章于 2022-02-11 21:19:10 发布
最新推荐文章于 2022-02-11 21:19:10 发布
阅读量864 收藏
点赞数

        id选择器（#myid）2.类选择器（.myclassname）3.标签选择器（div,h1,p）4.相邻选择器（h1+p）5.子选择器（ul < li）6.后代选择器（li a）7.通配符选择器（*）8.属性选择器（a[rel="external"]）9.伪类选择器（a:hover,li:nth-child）

sunzhemin
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
CSS选择器优先级以及效率排名以及如何提高选择器效率来提升web前端性能
此博客停止维护和更新，已转移https://github.com/ilvseyinfu/blog
09-07 851
CSS 三大特性： 继承/优先级/叠层(后者会覆盖前者) 优先级排序：！important > 行内样式 > id选择器 > 类选择器 > 标签选择器 > 通配符 > 继承 > 浏览器默认 id选择器（#myid） 类选择器（.myclassname） 标签选择器（div,h1,p） 相邻选择器（h1+p） 子选择器（ul 后代选择器（li a） 通配符选择器（*
纯CSS三角箭头，点击排序
cczsmile的博客
04-09 1245
css .triangle { display: inline-block; border-top: 8px solid #000; border-left: 6px solid transparent; border-right: 6px solid transparent; cursor: pointer; } .triangle-rotate-1...
风越.Net代码生成器 [FireCode Creator] V1.3 精简版
12-12
《风越.Net代码生成器 [FireCode Creator]》是一款采用.Net FrameWork2.0框架、基于多种数据库的程序代码生成软件，可快速建立数据信息的：添加、编辑、查看、列表、搜索功能。默认提供asp、aspx两种代码框架及多个界面设计模板，均可任意修改管理。通过自定义生成程序的界面风格与输出代码，用户可将其扩展为ASPX/ASP/PHP/JSP等各种程序的代码生成器。内置的.net代码框架，能建立C#语言的.net解决方案，可在VS2005中直接编辑，既能帮助.net初学者快速入门，更可最大限度提高.net程序员的代码编写效率。 01、支持生成的ASPX/ASP/PHP/JSP等页面在本机自动发布、调试（需安装IIS或对应WEB服务器） 02、支持Microsoft SQL Server、Microsoft Access、Oracle、MySql、Excel、FoxPro、FoxBase、Text等数据库连接 03、支持从数据表、视图（Access为查询）中读取数据字段 04、支持通过数据表中的组合主键传递参数 05、支持CSS统一设置页面风格 06、支持多种控件输入方式： 文本框 文本域 UBB文本框（支持UBB文本输入） 密码框 隐藏域 日期选择 单选框 复选框 下拉框 多选列表 单选列表 批量上载 上载文件 上载到库 07、支持多种信息显示方式： 显示文字 链接文件 文本框 文本域 显示图片 背景声音 视频播放 显示flash 08、支持检测提交字符的最小、最大输入长度、是否空值/唯一值、文本类型：★ 不检测 非特殊字符 仅单词字符 仅单词字符空格 仅26个字母 仅中文字符 仅允许整数 仅允许小数 仅日期/时间 仅日期+时间 仅日期 仅时间 仅允许邮箱 仅允许网址 仅允许IP 仅身份证号 仅国内电话 仅国内手机 09、支持对用户输入内容进行服务器端与客户端JS双重验证，有效防止SQL注入 ★ 10、支持自动生成多组多级的级联下拉框功能，快速建立如：省、市、县/公司、部门、小组等形式下拉框 ★ 11、支持表单提交超过100KB的文本数据 ★ 12、支持多文件上载、修改、删除记录时同步删除文件 13、支持控件名加密，使输入控件的名称与字段名不同，防止他人从客户端HTML中猜解 ★ 14、支持列表、搜索页面对数据记录进行实时排序、修改、批量删除等功能 15、支持表头/单独表格搜索两种布局方式 16、提供多种灵活翻页方案，用户可设置每页记录条数、上/下页、前/后N页、输入数字跳转到指定页面等，提高海量数据翻页速度 17、提供丰富的建站常用VB、JS函数库 ★ 18、更多扩展功能： 添加、修改页面在保存信息前进行预览功能 添加、修改页面提交后自动跳转并刷新列表页 字段描述批量格式化，可从字段名、描述生成，加强英文字符处理 列表、搜索页面隔行颜色、点击变色设置 根据数据库字段允许空值状态自动设置输入检测代码 页面皮肤模板设置，根据网页模板快速生成页面 ★ 设置指定字段在编辑信息时为只读状态 字段需要二次输入（如输入两次密码，以验证其正确性） ★ 在列表中直接批量编辑字段值，便于管理员维护 列表、搜索文件自动读取链接数据表值的实际信息 发送邮件功能，设置字段为邮件对应信息，可发送附件 ★ （繁、简、英）单语言版本 ★ 多语言页面实时翻译功能（默认：繁、简、英，可增加其它语言） ★ 多语言编码支持（GB2312/UTF8） ★ 生成提交校验码图片 ★ 搜索、列表文件以详细列表页（留言板风格）显示 生成权限，限制用户对指定页面的添加、删除、编辑权 将查询结果导出为CSV、HTML、EXCEL文件 ★ 生成不同选择字段的SQL语句 生成数据库字典 ★ 模板代码生成器，可自定义模板、变量生成代码 ★ 19、提供建站常用辅助工具： 屏幕尺 剪切板，保存最近指定次数的历史记录 常用加解密、编解码（DES、MD5、SHA、BASE64） 批量提取文本，支持正则表达式，可将HTML等文件中指定内容存入数据库 批量查找替换，支持正则表达式 批量文件、文件夹改名，支持正则表达式 正则表达式测试器（可设置、保存常用正则表达式） 获取键盘的按键值 网页隐藏资源下载，可下载无法直接得到URL的SWF、图片、音乐等资源 获取汉字的拼音、五笔编码、笔画数、笔顺名、部首等信息，并可进行汉字繁/简体，GB/BIG转换 代码编排器，CSS排版、JS、ASP、HTML注
风越.net代码生成器v2.9
12-21
《风越代码生成器 [FireCode Creator]》是一款采用.Net FrameWork2.0框架、基于多种数据库的程序代码生成软件，可快速建立数据信息的：添加、编辑、查看、列表、搜索功能。默认提供asp、aspx WEB程序、.net普通三层框架程序、.net Windows程序，多种代码框架及多个界面设计模板，均可任意修改管理。通过自定义生成程序的界面风格与输出代码，用户可将其扩展为ASPX/ASP/PHP/JSP等各种程序的代码生成器。内置的.net代码框架，能建立C#语言的.net解决方案，可在VS2005中直接编辑，既能帮助.net初学者快速入门，更可最大限度提高.net程序员的代码编写效率。 01、支持生成的ASPX/ASP/PHP/JSP等页面在本机自动发布、调试（需安装IIS或对应WEB服务器） 02、支持Microsoft SQL Server、Microsoft Access、Oracle、MySql、Excel、FoxPro、FoxBase、Text等数据库连接 03、支持从数据表、视图（Access为查询）中读取数据字段 04、支持通过数据表中的组合主键传递参数 05、支持CSS统一设置页面风格 06、支持多种控件输入方式： 文本框 文本域 UBB文本框（支持UBB文本输入） 密码框 隐藏域 日期选择 单选框 复选框 下拉框 多选列表 单选列表 批量上载 上载文件 上载到库 07、支持多种信息显示方式： 显示文字 链接文件 文本框 文本域 显示图片 背景声音 视频播放 显示flash 08、支持检测提交字符的最小、最大输入长度、是否空值/唯一值、文本类型：★ 不检测 非特殊字符 仅单词字符 仅单词字符空格 仅26个字母 仅中文字符 仅允许整数 仅允许小数 仅日期/时间 仅日期+时间 仅日期 仅时间 仅允许邮箱 仅允许网址 仅允许IP 仅身份证号 仅国内电话 仅国内手机 09、支持对用户输入内容进行服务器端与客户端JS双重验证，有效防止SQL注入 ★ 10、支持自动生成多组多级的级联下拉框功能，快速建立如：省、市、县/公司、部门、小组等形式下拉框 ★ 11、支持表单提交超过100KB的文本数据 ★ 12、支持多文件上载、修改、删除记录时同步删除文件 13、支持控件名加密，使输入控件的名称与字段名不同，防止他人从客户端HTML中猜解 ★ 14、支持列表、搜索页面对数据记录进行实时排序、修改、批量删除等功能 15、支持表头/单独表格搜索两种布局方式 16、提供多种灵活翻页方案，用户可设置每页记录条数、上/下页、前/后N页、输入数字跳转到指定页面等，提高海量数据翻页速度 17、提供丰富的建站常用VB、JS函数库 ★ 18、更多扩展功能： 添加、修改页面在保存信息前进行预览功能 添加、修改页面提交后自动跳转并刷新列表页 字段描述批量格式化，可从字段名、描述生成，加强英文字符处理 列表、搜索页面隔行颜色、点击变色设置 根据数据库字段允许空值状态自动设置输入检测代码 页面皮肤模板设置，根据网页模板快速生成页面 ★ 设置指定字段在编辑信息时为只读状态 字段需要二次输入（如输入两次密码，以验证其正确性） ★ 在列表中直接批量编辑字段值，便于管理员维护 列表、搜索文件自动读取链接数据表值的实际信息 发送邮件功能，设置字段为邮件对应信息，可发送附件 ★ （繁、简、英）单语言版本 ★ 多语言页面实时翻译功能（默认：繁、简、英，可增加其它语言） ★ 多语言编码支持（GB2312/UTF8） ★ 生成提交校验码图片 ★ 搜索、列表文件以详细列表页（留言板风格）显示 生成权限，限制用户对指定页面的添加、删除、编辑权 将查询结果导出为CSV、HTML、EXCEL文件 ★ 生成不同选择字段的SQL语句 生成数据库字典 ★ 模板代码生成器，可自定义模板、变量生成代码 ★ 19、提供建站常用辅助工具： 屏幕尺 剪切板，保存最近指定次数的历史记录 常用加解密、编解码（DES、MD5、SHA、BASE64） 批量提取文本，支持正则表达式，可将HTML等文件中指定内容存入数据库 批量查找替换，支持正则表达式 批量文件、文件夹改名，支持正则表达式 正则表达式测试器（可设置、保存常用正则表达式） 获取键盘的按键值 网页隐藏资源下载，可下载无法直接得到URL的SWF、图片、音乐等资源 获取汉字的拼音、五笔编码、笔画数、笔顺名、部首等信息，并可进行汉字繁/简体，GB/BIG转换 代码编排器，CSS排版、JS、ASP、HTML注释清理
风越.net代码生成器 v3.5
11-08
风越.net代码生成器 [FireCode Creator] 是一款采用.Net FrameWork2.0框架、基于多种数据库的程序代码生成软件，可快速建立数据信息的：添加、编辑、查看、列表、搜索功能。默认提供asp、aspx WEB程序、.net普通三层框架程序、.net Windows程序，多种代码框架及多个界面设计模板，均可任意修改管理。通过自定义生成程序的界面风格与输出代码，用户可将其扩展为ASPX/ASP/PHP/JSP等各种程序的代码生成器。内置的.net代码框架，能建立C#语言的.net解决方案，可在VS2005中直接编辑，既能帮助.net初学者快速入门，更可最大限度提高.net程序员的代码编写效率。 01、支持生成的ASPX/ASP/PHP/JSP等页面在本机自动发布、调试（需安装IIS或对应WEB服务器） 02、支持Microsoft SQL Server、Microsoft Access、Oracle、MySql、Excel、FoxPro、FoxBase、Text等数据库连接 03、支持从数据表、视图（Access为查询）中读取数据字段 04、支持通过数据表中的组合主键传递参数 05、支持CSS统一设置页面风格 06、支持多种控件输入方式： 文本框 文本域 UBB文本框（支持UBB文本输入） 密码框 隐藏域 日期选择 单选框 复选框 下拉框 多选列表 单选列表 批量上载 上载文件 上载到库 07、支持多种信息显示方式： 显示文字 链接文件 文本框 文本域 显示图片 背景声音 视频播放 显示flash 08、支持检测提交字符的最小、最大输入长度、是否空值/唯一值、文本类型：★ 不检测 非特殊字符 仅单词字符 仅单词字符空格 仅26个字母 仅中文字符 仅允许整数 仅允许小数 仅日期/时间 仅日期+时间 仅日期 仅时间 仅允许邮箱 仅允许网址 仅允许IP 仅身份证号 仅国内电话 仅国内手机 09、支持对用户输入内容进行服务器端与客户端JS双重验证，有效防止SQL注入 ★ 10、支持自动生成多组多级的级联下拉框功能，快速建立如：省、市、县/公司、部门、小组等形式下拉框 ★ 11、支持表单提交超过100KB的文本数据 ★ 12、支持多文件上载、修改、删除记录时同步删除文件 13、支持控件名加密，使输入控件的名称与字段名不同，防止他人从客户端HTML中猜解 ★ 14、支持列表、搜索页面对数据记录进行实时排序、修改、批量删除等功能 15、支持表头/单独表格搜索两种布局方式 16、提供多种灵活翻页方案，用户可设置每页记录条数、上/下页、前/后N页、输入数字跳转到指定页面等，提高海量数据翻页速度 17、提供丰富的建站常用VB、JS函数库 ★ 18、更多扩展功能： 添加、修改页面在保存信息前进行预览功能 添加、修改页面提交后自动跳转并刷新列表页 字段描述批量格式化，可从字段名、描述生成，加强英文字符处理 列表、搜索页面隔行颜色、点击变色设置 根据数据库字段允许空值状态自动设置输入检测代码 页面皮肤模板设置，根据网页模板快速生成页面 ★ 设置指定字段在编辑信息时为只读状态 字段需要二次输入（如输入两次密码，以验证其正确性） ★ 在列表中直接批量编辑字段值，便于管理员维护 列表、搜索文件自动读取链接数据表值的实际信息 发送邮件功能，设置字段为邮件对应信息，可发送附件 ★ （繁、简、英）单语言版本 ★ 多语言页面实时翻译功能（默认：繁、简、英，可增加其它语言） ★ 多语言编码支持（GB2312/UTF8） ★ 生成提交校验码图片 ★ 搜索、列表文件以详细列表页（留言板风格）显示 生成权限，限制用户对指定页面的添加、删除、编辑权 将查询结果导出为CSV、HTML、EXCEL文件 ★ 生成不同选择字段的SQL语句 生成数据库字典 ★ 模板代码生成器，可自定义模板、变量生成代码 ★
风越ASP代码生成器FireAspCreatorv2.9.rar
05-23
《风越代码生成器 [FireCode Creator]》是一款采用.Net FrameWork2.0框架，基于多种数据库的程序代码生成软件，可快速建立数据信息的：添加、编辑、查看、列表、搜索页面。通过界面模板与代码模板管理功能，可自定义生成程序的界面风格与输出代码，将最大限度提高ASPX/ASP/PHP/JSP等各种程序的编写效率。 01、支持生成的ASPX/ASP/PHP/JSP等页面在本机自动发布、调试（需安装IIS或对应WEB服务器） 02、支持Microsoft SQL Server、Microsoft Access、Oracle、MySql、Excel、FoxPro、FoxBase、Text等数据库连接 03、支持从数据表、视图（Access为查询）中读取数据字段 04、支持通过数据表中的组合主键传递参数 05、支持CSS统一设置页面风格 06、支持多种控件输入方式： 文本框 文本域 UBB文本框（支持UBB文本输入） 密码框 隐藏域 日期选择 单选框 复选框 下拉框 多选列表 单选列表 批量上载 上载文件 上载到库 07、支持多种信息显示方式： 显示文字 链接文件 文本框 文本域 显示图片 背景声音 视频播放 显示flash 08、支持检测提交字符的最小、最大输入长度、是否空值/唯一值、文本类型：★ 不检测 非特殊字符 仅单词字符 仅单词字符空格 仅26个字母 仅中文字符 仅允许整数 仅允许小数 仅日期/时间 仅日期+时间 仅日期 仅时间 仅允许邮箱 仅允许网址 仅允许IP 仅身份证号 仅国内电话 仅国内手机 09、支持对用户输入内容进行服务器端与客户端JS双重验证，有效防止SQL注入 ★ 10、支持自动生成多组多级的级联下拉框功能，快速建立如：省、市、县/公司、部门、小组等形式下拉框 ★ 11、支持表单提交超过100KB的文本数据 ★ 12、支持多文件上载、修改、删除记录时同步删除文件 13、支持控件名加密，使输入控件的名称与字段名不同，防止他人从客户端HTML中猜解 ★ 14、支持列表、搜索页面对数据记录进行实时排序、修改、批量删除等功能 15、支持表头/单独表格搜索两种布局方式 16、提供多种灵活翻页方案，用户可设置每页记录条数、上/下页、前/后N页、输入数字跳转到指定页面等，提高海量数据翻页速度 17、提供丰富的建站常用VB、JS函数库 ★ 18、更多扩展功能： 添加、修改页面在保存信息前进行预览功能 添加、修改页面提交后自动跳转并刷新列表页 字段描述批量格式化，可从字段名、描述生成，加强英文字符处理 列表、搜索页面隔行颜色、点击变色设置 根据数据库字段允许空值状态自动设置输入检测代码 页面皮肤模板设置，根据网页模板快速生成页面 ★ 设置指定字段在编辑信息时为只读状态 字段需要二次输入（如输入两次密码，以验证其正确性） ★ 在列表中直接批量编辑字段值，便于管理员维护 列表、搜索文件自动读取链接数据表值的实际信息 发送邮件功能，设置字段为邮件对应信息，可发送附件 ★ （繁、简、英）单语言版本 ★ 多语言页面实时翻译功能（默认：繁、简、英，可增加其它语言） ★ 多语言编码支持（GB2312/UTF8） ★ 生成提交校验码图片 ★ 搜索、列表文件以详细列表页（留言板风格）显示 生成权限，限制用户对指定页面的添加、删除、编辑权 将查询结果导出为CSV、HTML、EXCEL文件 ★ 生成不同选择字段的SQL语句 生成数据库字典 ★ 模板代码生成器，可自定义模板、变量生成代码 ★ 19、提供建站常用辅助工具： 屏幕尺 剪切板，保存最近指定次数的历史记录 常用加解密、编解码（DES、MD5、SHA、BASE64） 批量提取文本，支持正则表达式，可将HTML等文件中指定内容存入数据库 批量查找替换，支持正则表达式 批量文件、文件夹改名，支持正则表达式 正则表达式测试器（可设置、保存常用正则表达式） 获取键盘的按键值 网页隐藏资源下载，可下载无法直接得到URL的SWF、图片、音乐等资源 获取汉字的拼音、五笔编码、笔画数、笔顺名、部首等信息，并可进行汉字繁/简体，GB/BIG转换 代码编排器，CSS排版、JS、ASP、HTML注释清理
CSS选择器及其优先级排序
叮当了个河蟹
10-12 5859
一、 CSS选择器分类 CSS选择器如下： CSS的选择器其实大类的话可以分为三类，即id选择器、class选择器、标签选择器。 用法如下： id选择器： #id名 { 属性名:属性值; } class选择器 ：.class名 { 属性名:属性值; } 标签选择器： 标签名 { 属性名:属性值; } 其中，他们之间又可以以不同的方式进行组合，如下： 后代选择器: 父代名 后代名 { 属性...
【CSS】选择器优先级
金金的博客
09-16 2973
1、选择器（优先级） 选择器种类： 严格来讲，选择器的种类可以分为三种：标签名选择器、类选择器和ID选择器。 而所谓的后代选择器和群组选择器只不过是对前三种选择器的扩展应用。 而在标签内写入style=""的方式，应该是CSS的一种引入方式，而不是选择器，因为根本就没有用到选择器。 而一般人们将上面这几种方式结合在一起，所以就有了5种或6种选择器了。 选择器优先级： CSS选择器效率从高到低的排序如下： 1.id选择器（#myid） 2.类选择器（.myclassname） 3.标签选择器（div,h1,p
css选择器的效率
chijiesou6359的博客
02-25 389
CSS选择器对我们来说并不是什么新东西，比如我们常用的基本选择器“元素标签选择器div”、“id选择器#header”、“类选择器.class”，或者我们很少见的伪类选择器“:focus”以及更复杂的 css3选择器“:nth-child”等等。 选择器有一个固有的效率，我们来看Steve S...
css选择器权重排序_css选择器优先级高低排列_css样式权重计算和!important属性
weixin_33837884的博客
01-13 844
首先我们需要知道选择器的类型有这些：选择器栗子ID#idclass.class标签p属性[type='text']伪类:hover伪元素::first-line相邻选择器、子代选择器>+而这些css的选择器是有权重(即优先级)的，在不同选择器的样式出现冲突时候，会采用权重高的选择器设置样式，而优先级不仅仅只是：“行间>内部>外部、ID>class>元素”。css优先级...
从左往右 从上到下依次排序 flex css_CSS
weixin_39525307的博客
12-08 1759
12. CSS基础目前使用最广泛的版本是CSS2.1http://caniuse.com --测试该布局有哪些浏览器支持体系化学习CSS语法（怎么写代码）如何调试（怎么知道自己代码写错了）在哪查资料（抄代码）标准制定者CSS语法语法一选择器 { 属性名: 属性值; /* 注释 */ } 语法二@charset "UTF-8"; @import url(2.css); @media...
风越asp代码生成器 V3.5
11-08
《风越代码生成器 [FireCode Creator]》是一款采用.Net FrameWork2.0框架、基于多种数据库的程序代码生成软件，可快速建立数据信息的：添加、编辑、查看、列表、搜索功能。默认提供asp、aspx WEB程序、.net普通三层...
浏览器对html、 js、css的解析先后顺序
qq_39004843的博客
03-01 750
1、总的来说就是按照html文档的顺序加载 2、还有就是最好将无论内部或是外部JS文件放到所有html内容之后，这样会令用户感觉页面加载速度变快了，否则如果将所有外部文件（包括css和JS）引用都放到中，意味着必须等到全部的JS代码都被下载解析和执行完毕后，才能开始呈现页面的内容（当浏览器遇到）,这样会导致呈现页面时出现明显的延迟，二延迟期间的浏览器窗口将是一片空白。 浏览器载入HTML、CSS、JS文件的加载顺序及执行情况 ...
CSS3动画播放时间-速度分析
liudanyang_21的博客
07-25 1043
CSS3最引人注目的莫过于支持动画效果。只要预先定义好关键帧的css样式，以及动画时间，浏览器就会自动生成播放其中的每个帧。这在以往需要不少的js代码，并且运行效率并不高。CSS3的动画效果极大程度上减轻了脚本的编写，使得开发者可以把更多的精力投入在内容上，而不是实现上。 不过就目前而言，能完全支持CSS3动画的只有webkit内核的浏览器，safari和chorme。但随着形势的发展，越来越多的浏览器会完善CSS3动画效果。因此这里就以webkit为基础，探讨动画效果的“动”字——...
css3动画速度曲线
ministech的博客
02-02 9797
语法一 animation-timing-function: value; value: linear 动画从头到尾的速度是相同的。 ease 默认。动画以低速开始，然后加快，在结束前变慢。 ease-in 动画以低速开始。 ease-out 动画以低速结束。 ease-in-out 动画以低速开始和结束。 cubic-bezier(n,n,n,n) 在 cub
CSS基本选择器及优先级顺序
weixin_46446158的博客
02-11 3045
CSS选择器是编写CSS代码时的一个核心概念，我们在设计网页页面时，使用css对HTML页面中的元素实现一对一，一对多或者多对一的控制，这就需要用到CSS选择器。而HTML页面中的元素就是通过CSS选择器进行控制的，以下是自己在学习及工作过程中对CSS选择器的一些总结. CSS基本选择器 一、标签选择器 body,div,p,ul,li... 二、类选择器 class="p1" class="p2" 三、ID选择器 id="...
css选择器的优先级，以及用法
热门推荐
hellow_tommer的博客
11-27 1万+
前言 本篇主要是css的选择器，及用法 总结 提示：这里对文章进行总结： 以上就是今天要分享的内容，如有错误，欢迎大家指出，我会及时修改的。 ...
如何提高CSS选择器效率
12点
08-30 154
  首先我们需要清楚，浏览器是如何读取选择器，以识别样式，并将相应的样式附于对应的HTML元素，达到美化页面的效果。Chris Coyier曾在《Efficiently Rendering CSS》一文中说过“浏览器读取你的选择器，遵循的原则是从选择器的右边到左边读取。换句话说，浏览器读取选择器的顺序是由右到左进行”。比如说：   div.nav &gt; ul li a     上...
css 优先级总结
u598975767的专栏
05-26 1195
层叠优先级是: 浏览器缺省   其中样式表又有: 类选择器   派生选择器以前叫上下文选择器，所以完整的层叠优先级是: 浏览器缺省   为了说明该问题，请参见下面的例子说明。 [html] view plain copy html>   head>       title>title>  
css选择器，优先级排序
最新发布
07-09
在CSS中，选择器的优先级决定了当多个规则应用于同一个元素时，哪个规则将会被应用。选择器的优先级是根据其特定组件的组成方式来计算的。以下是选择器优先级的排序（从高到低）： 1. 内联样式（Inline Styles）：通过在元素的`style`属性中直接定义样式，该样式具有最高的优先级。 2. ID选择器（ID Selectors）：通过元素的`id`属性进行选择，使用`#`符号表示。例如：`#myElement`。 3. 类选择器、属性选择器和伪类选择器（Class Selectors, Attribute Selectors, and Pseudo-class Selectors）：通过类名、属性或伪类进行选择。例如：`.myClass`、`[type="text"]`、`:hover`。 4. 元素选择器和伪元素选择器（Element Selectors and Pseudo-element Selectors）：通过元素名或伪元素进行选择。例如：`div`、`::before`。 5. 通用选择器和子选择器（Universal Selectors and Child Selectors）：通用选择器`*`和子选择器`>`具有较低的优先级。 6. 继承样式（Inherited Styles）：某些属性可以从父元素继承，如果没有定义特定样式，则会应用继承的样式。这些样式具有最低的优先级。 当多个选择器具有相同的优先级时，最后定义的规则将会覆盖之前的规则。 需要注意的是，使用`!important`标记可以将样式声明的优先级提升到最高，但是滥用`!important`可能会导致样式难以维护和调试，因此应该慎用。 总结：CSS选择器的优先级排序是通过内联样式、ID选择器、类选择器、属性选择器、伪类选择器、元素选择器、伪元素选择器、通用选择器、子选择器和继承样式的顺序来决定的。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值