一、指定选择器

有时个会希望控制某个元素在一定范围内的对象样式，这时就可以把元素与Class或者Id选择器结合起来使用

<!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" />

<title>指定选择器</title>

<style type="text/css">

span.red{

    color:red;

}

div#top{

    color:blue;

    }

</style>

</head>

<body>

<span class="red">这是个SPAN类名为CLASS</span>

<span>这是个SPAN</span>

<div id="top">这是个DIVID是TOP</div>

<div >这是个DIV</div>

</body>

</html>

指定选择器对象定义样式限定为class或者id属性的某种元素非常有用，它对元素的控制精度介于标签选择器与id或者类选择器之间，是一种非常实用的选择器类型

如下面模块中如何控制新闻的正文

<div>

<h2 class="news">新闻标题</h2>

<p class="news">新闻正文</p>

<span class="news">新闻说明</span>

<p>其它文件信息</p>

</div>

css

div p.news{

    font-size:18px;

    color:#FF00FF;

    }

或者

p.news{

    font-size:18px;

    color:#00FFFF;

    }

CSS 指定选择器(十一)的更多相关文章

  1. CSS :first-child 选择器 和 HTML DOM firstChild 属性

    CSS 选择器参考手册 实例 选择属于其父元素的首个子元素的每个 <p> 元素,并为其设置样式: p:first-child { background-color:yellow; } 亲自 ...

  2. jquery内容选择器（匹配包含指定选择器的元素）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. CSS 类选择器

    在 CSS 中,类选择器以一个点号显示: .center {text-align: center} 在上面的例子中,所有拥有 center 类的 HTML 元素均为居中. 在下面的 HTML 代码中, ...

  4. CSS id 选择器

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

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

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

  6. CSS样式选择器

    <!-- css样式选择器 HTML选择器 类选择器 ID选择器 关联选择器 组合选择器 伪元素选择器 selector{ /* selector是样式选择器 property:value; / ...

  7. CSS中选择器优先级顺序实战讲解

    原文:CSS中选择器优先级顺序实战讲解 我们有些程序猿在给一个元素(比如div)应用样式的时候,会有一些疑问,为什么我写在后面的样式不能覆盖前面的样式呢,不是说CSS是层叠样式表吗? 如果你在开发中也 ...

  8. CSS.01 -- 选择器及相关的属性文本、文字、字体、颜色、

    与html相比,Css支持更丰富的文档外观,Css可以为任何元素的文本和背景设置颜色:允许在任何元素外围设置边框:允许改变文本的大小,装饰(如下划线),间隔,甚至可以确定是否显示文本. 什么是CSS? ...

  9. css以及选择器基础

    CSS样式基础了解1.css基础语法CSS样式的出现是为了将内容和表现分离极大的提高了工作效率内联样式(在 HTML 元素内部)<p style="margin-left: 10px: ...

随机推荐

  1. Java知多少（106）程序与数据库连接

    一个网络关系数据库应用系统是一个三层次结构.客户机与服务器采用网络连接,客户机端应用程序按通信协议与服务器端的数据库程序通信:数据库服务程序通过SQL命令与数据库管理系统通信. Java程序与数据库连 ...

  2. NPM使用详解（上）

    1.NPM是什么? NPM是JavaScript的包管理工具,在安装NodeJS(什么?你不知道node?来,我们合计合计:https://nodejs.org/)的时候,会自动安装上npm. 要查看 ...

  3. 编写高质量JS代码的68个有效方法（十三）

    No.61.不要阻塞I/O事件队列 Tips: 异步API使用回调函数来延缓处理代价高昂的操作以避免阻塞主应用程序 JavaScript并发的接收事件,但会使用一个事件队列按序地处理事件处理程序 在应 ...

  4. bower的使用

    一.bower的安装 安装nodejs的最新版本: 安装npm. 由于npm是nodejs的包管理器,所以在将nodejs安装完成后,npm也就自动安装完成. 安装git. 安装bower. 使用 n ...

  5. [OpenCV] Image Processing - Spatial Filtering

    "利用给定像素周围的像素的值决定此像素的最终的输出值“ 教学效果: 策略: 1. 拉普拉斯,突出小细节: . 梯度,突出边缘: . 平滑过的梯度图像用于掩蔽: . 灰度变换,增加灰度动态范围 ...

  6. keepalived程序包

    keepalived自带两个程序包 1. keepalived守护进程 [root@lvs /root]# keepalived –-helpkeepalived Version 0.6.1 (06/ ...

  7. C#语法糖之 ReflectionSugar 通用反射类

    用法很简单: ReflectionSugar rs = new ReflectionSugar(100);//缓存100秒 ,可以不填默认不缓存 rs.有嘛点嘛   性能测试: 性能测试类源码: ht ...

  8. 服务器唯一id生成规则

    在使用hashCode的时候,发现会出现相同id,虽然几率很小.虽然发现并不是hashCode的原因,而是其他逻辑的问题. 但是还是试着自己写了一个id生成器,有些id是int的,比如说任务id:有些 ...

  9. 环信SDK与Apple Watch的结合（3）

    第3章主要介绍怎样在Watch App的页面上显示iPhone程序里的数据.主要操作的是“EMWatchOCDemo WatchKit Extension”这个文件夹,附源码EMWatchOCDemo ...

  10. DotNetCore跨平台~性能测试~可以放心使用了

    使用dotnetCore发布站点后,它的处理请求能力不逊色IIS等大型服务的能力,号称每秒能处理115万个请求,太牛X了也. 先看看它支持的数据库 以下主流数据库都是为支持的 Microsoft SQ ...