1  添加几个标签

<body>
<span>第一个span标签</span>
<p>这是第一个p标签</p>
<span>第二个span</span>
</body>

2  比如查找第二个span标签

/*1  精确查找, 直接从span的父标签里面查找,查找的就是span,是就直接加载,否则就不加载*/
span:nth-of-type(2){
color: cyan
}
/*2   模糊查找,没找到就不加载,是从所有标签中找*/
span:nth-child(6){
color:green;
}
/*span:nth-child(4){
color: red;
}*/
 
3  具体代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<style>
/*精确查找*/
span:nth-of-type(2){
color: cyan
}
/*模糊查找*/
span:nth-child(6){
color:green;
}
/*span:nth-child(4){
color: red;
}*/
</style>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>查找标签</title>
</head>
<body>
<span>第一个span标签</span>
<p>这是第一个p标签</p>
<span>第二个span</span>
</body>
</html>
 

VS Code中html 如何查找标签(5)的更多相关文章

  1. VS Code中编写html(5) 标签的布局设置

    1  <!--首先在div中添加四个span标签--> <div> <!--span*4+tab--> <!--span{span$}*4--> < ...

  2. VS Code中编写html(4) 标签的宽高颜色背景设置

    1  <!+Tab键--> <!--有两个div标签时,分别设置style,有两种方法--> <div id="div1">第一个div标签:& ...

  3. VS Code中编写html(3) 标签的宽高颜色背景设置

    1 创建一个div标签: <body> <div> 这是一个div标签: </div> </body> 变成了圆圆的,是因为后面有设置了样式: back ...

  4. JS BOM DOM对象 select联动 计时器 时间 css操作 节点(标签 ) 查找标签 {前端基础之BOM和DOM}

    前端基础之BOM和DOM 前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互,我 ...

  5. 沉淀,再出发:sublime中快捷键和html标签的使用和生成以及使用markdown

    沉淀,再出发:sublime中快捷键和html标签的使用和生成以及使用markdown 一.前言 工欲善其事,必先利其器.在软件代码的编写中,一定要知道IDE或者编辑器的快捷键的使用,这样可以提高很多 ...

  6. DOM标签操作与事件与jQuery查找标签

    目录 DOM之操作标签 创建标签对象 标签对象的属性 innerText与innerHTML 标签内部追加内容 属性操作 事件 常用事件 事件绑定 事件案例 jQuery简介 查找标签 基本选择器 属 ...

  7. 在 Visual Studio Code 中使用 PoweShell - CodeShell

    一直希望在 Visual Studio Code 中使用 PowerShell,插件 CodeShell 提供了对于 PowerShell 的支持. 安装 首先按 F1,打开命令窗口,输入安装插件的命 ...

  8. Dubbo中对Spring配置标签扩展

    Spring提供了可扩展Schema的支持,完成一个自定义配置一般需要以下步骤: 设计配置属性和JavaBean 编写XSD文件 编写NamespaceHandler和BeanDefinitionPa ...

  9. Dom,查找标签和操作标签

    Dom,查找标签和操作标签 文档对象模型(Document Object Model,DOM)是一种用于HTML和XML文档的编程接口.它给文档提供了一种结构化的表示方法,可以改变文档的内容和呈现方式 ...

随机推荐

  1. android下xml放哪儿?

    1.用Project->Deployment,打开发布文件窗口,增加要发布的文件.然后设置文件发布的位置Remote Path,填写为assets\internal\ 2.代码 varp: st ...

  2. QT的creator中图示

    不同的开发工具显示class和相关的用不同的图标表示.但大同小异.但对于QT的creator中图示确实不太好分.看图一目了然.

  3. lucene_02_IKAnalyre

    前言 在lucene中虽然已经提供了许多的分词器:StandardAnalyzer.CJKAnalyzer等,但在解析中文的时候都会把文中拆成一个个的单子. 毕竟老外不懂中文.这里介绍一个中文的分词器 ...

  4. 转载 - 汇编--INT 10H功能

    出处:http://www.cnblogs.com/magic-cube/archive/2011/10/19/2217676.html INT 10H 是由 BIOS 对屏幕及显示器所提供的服务程序 ...

  5. BA-WG-调试经验

    Modbus网关 目前常用的产品为BAM360,仅可以用做modbus RTU主站,可以从从站扫描数据,接入的数据必须为标准的MODBUS RTU从站 串口数据 使用sc-431硬件将串口数据转换为m ...

  6. @Zookeeper可视化工具。 ZK 安装 node-zk-browser。2015.10.22亲测可用

    zookeeper基本是基于API和console进行znode的操作,并没有一个比较方便的操作界面,这里也发现了taobao 伯岩写的一个工具,可以比较方便的查询zookeeper信息. 工具的开发 ...

  7. C语言中为什么要使用enum

    转载请注明出处,否则将追究法律责任http://blog.csdn.net/xingjiarong/article/details/47275971 在C语言中有一个关键字是enum,枚举类型,不知道 ...

  8. C#实体转换

    using System; using System.Collections.Generic; using System.Data; using System.Data.Common; using S ...

  9. wpf Textbox 点击选中全部文本

    用法:依赖属性 SelectTextOnFocus.Active = True public class SelectTextOnFocus : DependencyObject { public s ...

  10. bootstrap搜索样式

    <div class="container"> <div class="input-group"> <input type=&qu ...