一、指定选择器

有时个会希望控制某个元素在一定范围内的对象样式，这时就可以把元素与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. 【转载】两个排序数组的中位数 / 第K大元素（Median of Two Sorted Arrays）

    转自 http://blog.csdn.net/zxzxy1988/article/details/8587244 给定两个已经排序好的数组(可能为空),找到两者所有元素中第k大的元素.另外一种更加具 ...

  2. 关于全局唯一ID生成方法

    引:最近业务开发过程中需要涉及到全局唯一ID生成.之前零零总总的收集过一些相关资料,特此整理以便后用 本博客已经迁移至:http://cenalulu.github.io/ 本篇博文已经迁移,阅读全文 ...

  3. Transact-SQL 示例 - 使用脚本备份数据库的示例

    在常规的数据库开发与维护的过程中,常常需要对数据库进行数据备份,最入门的办法就是使用SSMS图形化界面提供的数据库备份向导一步一步操作进行备份,这种方式虽然简单快捷但是日子久了就会觉得重复且繁琐.下面 ...

  4. 浅谈C++的this指针

    之所以写这篇文章,主要是为了回答网友 zhancaihua123同学的下面几个问题: father* p=new son;p->disp(...);father是父类,son是子类.disp是一 ...

  5. Ember Charts – 基于 Ember & D3 的图表库

    Ember Charts 是一个基于 Ember.js 和 D3.js 的图表库.它包括时间序列.柱状图.饼图.点图,很容易扩展和修改.这些图表组件代表图表交互性和演示的最佳实践,是高度可定制和可扩展 ...

  6. SQL Server中的事务日志管理(4/9)：简单恢复模式里的日志管理

    当一切正常时,没有必要特别留意什么是事务日志,它是如何工作的.你只要确保每个数据库都有正确的备份.当出现问题时,事务日志的理解对于采取修正操作是重要的,尤其在需要紧急恢复数据库到指定点时.这系列文章会 ...

  7. 数据库收缩：NOTRUNCATE与TRUNCATEONLY

    在进行数据库收缩时,我们有2个可用选项:NOTRUNCATE,TRUNCATEONLY.这篇文章我们会详细讨论下这2个选项的具体区别. NOTRUNCATE 当你对数据库收缩命令提供NOTRUNCAT ...

  8. mysql主从复制显示正常，数据没同步现象。

    当时在一个服务器上开启了多实例,主从复制结构图如下: 当时在192.168.10.3的服务器上用show slave status;显示的是正常的复制的,两个线程都为yes,并且读与写的pos也一直在 ...

  9. 【Win10】单元测试中捕获异步方法的指定异常

    温馨提醒:本文需要知道什么是单元测试才能阅读. 在之前 WPF.ASP.NET 中,单元测试要捕捉指定异常,我们是通过 ExpectedExceptionAttribute 来实现的.如下图: 但是, ...

  10. KMP - HDU 1711 Number Sequence

    Number Sequence Time Limit: 10000/5000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) ...