css选择器

最新推荐文章于 2024-07-11 18:05:14 发布
最新推荐文章于 2024-07-11 18:05:14 发布
阅读量501 收藏
点赞数
分类专栏： js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/pf1234321/article/details/39779767
版权
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <link rel="stylesheet" type="text/css" href="style.css" />

  <script type="text/javascript" src="jquery-1.4.4.js"></script>

  <script type="text/javascript">

  $(document).ready(function()
  {
    $("#button1").click(function()
    {
        $("#one").css("background", "red");
    });
    $("#button2").click(function()
    {
        $(".mini").css("background", "green");
    });
    $("#button3").click(function()
    {
        $("div").css("background", "orange");
    });
    $("#button4").click(function()
    {
        $("*").css("background", "blue");
    });
    $("#button5").click(function()
    {
        $("#two, .mini").css("background", "pink");
    });
  });
  </script>
</head>
<body>

 <h3>基本选择器.</h3>
 <input type="button" value="test1" id="button1">
 <input type="button" value="test2" id="button2">
 <input type="button" value="test3" id="button3">
 <input type="button" value="test4" id="button4">
 <input type="button" value="test5" id="button5">
 <div class="one" id="one" >
 id为one,class为one的div
      <div class="mini">class为mini</div>
  </div>
    <div class="one"  id="two" title="test" >
     id为two,class为one,title为test的div.
      <div class="mini"  title="other">class为mini,title为other</div>
      <div class="mini"  title="test">class为mini,title为test</div>
  </div>

  <div class="one">
      <div class="mini">class为mini</div>
      <div class="mini">class为mini</div>
      <div class="mini">class为mini</div>
      <div class="mini"></div>
  </div>



  <div class="one">
      <div class="mini">class为mini</div>
      <div class="mini">class为mini</div>
      <div class="mini">class为mini</div>
      <div class="mini"  title="tesst">class为mini,title为tesst</div>
  </div>


  <div style="display:none;"  class="none">style的display为"none"的div</div>
 
  <div class="hide">class为"hide"的div</div>
 
  <div>
  包含input的type为"hidden"的div<input type="hidden" size="8"/>
  </div>

</body>
</html>

pf1234321
关注
专栏目录
CSS选择器.pdf
10-09
在CSS选择器的体系中，存在多种不同类型的选择器，每种都有其特定的用途和使用场景。 首先，元素选择符是最基本的类型，包括通配符选择器、标签选择器、id选择器和class选择器。通配符选择器用“*”表示，可以选中...
CSS教程之css选择器 、属性、值
10-30
本教程将深入探讨CSS选择器、属性以及值，帮助你更好地理解和应用CSS来美化你的网页。 首先，我们要了解CSS选择器。选择器是CSS的核心组成部分，它的主要作用是定位HTML文档中的特定元素，以便对这些元素应用样式。...
CSS选择器
weixin_53912712的博客
06-24 3785
CSS的基本语法 常用选择器 复合选择器 关系选择器 属性选择器 伪类选择器 超链接的伪类 伪元素
CSS 选择器
m0_60508194的博客
09-26 1711
可以将CSS选择器分为五类：
css 选择器
qq_42638586的博客
04-10 1645
css选择器
css 选择器 详解
2301_76669854的博客
12-12 2699
使用。
CSS选择器大全
认真学习前端的博客
03-08 2145
CSS选择器中的通用 ID class 标签 属性以及交集 并集选择器，伪类，伪元素选择器等等 还有选择器的优先级权值等内容
CSS选择器优先级
热门推荐
qq_46133833的博客
04-30 5万+
CSS选择器优先级 （1）CSS选择器都有权重值，权重值越大优先级越高。 内联样式表的权重值最高，值为1000。 id选择器的权重值为100。 class选择器的权值为10。 类型（元素）选择器的优先级为1。 通配符选择器的优先级为0。 （2）当权值相等时，后定义的样式表要优于先定义的样式表。 （3）在同一组属性设置中表有**“!important"**规则的优先级最大。 后代选择器 CSS后代选择器指为某标签元素内的特定后代标签元素来定义其样式。在CSS后代选择器中，规则左边的选择器一端包含两个或多个
css选择器有哪些？
weixin_47450807的博客
04-04 1万+
一、写在前面 css选择器有很多，但是常用到的也就几个，今天总结一下。 二、具体选择器 2.1、id选择器 #myId {} 2.2、类选择器 .myClass {} 2.3、标签选择器 p,h1 {} 2.4、后代选择器 div h1 {} 2.5、子选择器 div>h1 {} 2.6、兄弟选择器(所有的兄弟) ul~h1 {} 2.7、相邻兄弟选择器 ul+h1 {} 2.8、属性选择器 li[name='sss'] {} 2.9、伪类选择器 h1:hover {} 2.10 h
CSS选择器：基本选择器、复合选择器、伪类选择器、伪元素选择器
最新发布
pan_junbiao的博客
07-11 2351
CSS选择器包含：基本选择器、复合选择器、伪类选择器、伪元素选择器。基本选择器包括：元素选择器、类选择器、ID 选择器、属性选择器。最常见的 CSS 选择器是元素选择器。换句话说，HTML文档的元素就是最基本的选择器。例如设置 HTML 样式，选择器通常是某个 HTML 元素，如 p、h1、a 等，甚至可以是 HTML 本身。在 HTML 中，各种各样的属性可以给元素添加很多附件信息，并且可以通过 JavaScript 控制这些附加属性的内如何状态。在使用 CSS 的时候，也可以使用这些附加属性来指定元素。
Css选择器
椰汁菠萝
05-26 7139
CSS3 选择器 在 CSS 中，选择器是一种模式，用于选择需要添加样式的元素。 "CSS" 列指示该属性是在哪个 CSS 版本中定义的。（CSS1、CSS2 还是 CSS3。） 选择器 例子 例子描述 CSS .class .intro 选择 class="intro" 的所有元素。 1 #id
react-React组件的css选择器
08-15
在React开发中，CSS选择器是用于特定于组件的样式化的一种强大工具。React组件的样式管理是一个关键的方面，因为它影响着应用的可维护性和性能。本篇将深入探讨React组件与CSS选择器的结合使用，以及如何优化组件的...
CSS 选择器支持列表
09-25
CSS 选择器支持列表 CSS 选择器是 CSS 中的一个重要组成部分，它允许开发者根据特定的规则来选择和应用样式到 HTML 元素上。下面是 CSS 选择器支持列表的详细解释： ### 一、基本选择器 * `E`：选择所有 HTML ...
复制Css选择器「Copy Css Selector」-crx插件
03-09
扩展开发工具和上下文菜单，添加...用鼠标右键单击元素并选择复制Css选择器菜单项到缓冲区，所以您可以将复制的选择器复制到任何文本编辑器。 对于快速获取选择器来测试框架（如Selenium）非常有用。 支持语言:English
CSS选择器-.pdf
02-28
此外，CSS 还提供了分组选择器，可以将多个选择器分组在一起，并应用同样的样式。例如： ```css h2, p {color: gray;} ``` 这将将 h2 和 p 元素的颜色设置为灰色。 分组选择器可以将任意多个选择器分组在一起，对此...
Jquery中CSS选择器用法分析
11-30
本文实例讲述了Jquery中CSS选择器用法。分享给大家供大家参考。具体如下： jQuery使用了一套css选择器，共有5种，即标签选择器，ID选择器，类选择器，通用选择器和群组选择器，现分述如下： 1. 标签选择器 用于选择...
dompath:一个为DOM节点生成CSS选择器的JS库
04-28
简单的实验库，可从DOM节点生成CSS选择器。 用法 //call function, pass any element: var path = dompath(document.body); //get CSS selector: var selector = path.toCSS(); //can be serialized into JSON: var...
CSS选择器类型及其作用详解
CSS选择器不仅限于单独使用，它们可以组合、嵌套使用，也可以通过逗号分隔来选择多个元素，大大提高了样式的灵活性和控制力。理解和掌握不同类型的选择器是前端开发者进行网页设计与开发的基础技能之一。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值