<!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>
<style type="text/css">
/*
选择器: 选择器的作用就是找到对应的数据进行样式化。 1.标签选择器: 就是找到所有指定的标签进行样式化。 格式:
标签名{
样式1;样式2....
} 例子:
div{
color:#F00;
font-size:24px;
}
2. 类选择器: 使用类选择器首先要给html标签指定对应的class属性值。 格式:
.class的属性值{
样式1;样式2...
} 例子:
.two{
background-color:#0F0;
color:#F00;
font-size:24px;
} 类选择器要注意的事项:
1. html元素的class属性值一定不能以数字开头.
2. 类选择器的样式是要优先于标签选择器的样式。 3. ID选择器: 使用ID选择器首先要给html元素添加一个id的属性值。 ID选择器的格式: #id属性值{
样式1;样式2...
}
id选择器要注意的事项:
1. ID选择器的样式优先级是最高的,优先于类选择器与标签选择器。
2. ID的属性值也是不能以数字开头的。
3. ID的属性值在一个html页面中只能出现一次。 4. 交集选择器: 就是对选择器1中的选择器2里面的数据进行样式化。 选择器1 选择器2{
样式1,样式2....
} 例子:
.two span{
background-color:#999;
font-size:24px;
} 5. 并集选择器: 对指定的选择器进行统一的样式化。 格式:
选择器1,选择器2..{
样式1;样式2...
} span,a{
border-style:solid;
border-color:#F00;
}
6. 通过选择器: {
样式1;样式2...
} */ *{
text-decoration:line-through;
background-color:#CCC;
} </style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<div id="one" class="two">这个是<span>第一个div标签</span>...</div>
<div id="one" class="two">这个是<span>第二个div标签</span>...</div>
<span>这个是一个span标签</span><br/>
<a class="two" href="#">新闻标题</a> </body>
</html>

Css详解之(选择器)的更多相关文章

  1. CSS详解

    Web前端开发css基础样式总结 颜色和单位的使用 颜色 用颜色的名字表示颜色,比如:red 用16进制表示演示 比如:#FF0000 用rgb数值表示颜色,rgb(红,绿,蓝),每个值都在0-255 ...

  2. DIV+CSS详解

    DIV+CSS详解 ✪DIV+CSS"这种叫法其实是一种不准确的叫法 在做笔记的最前面必须先给大家纠正一个错误,就是"DIV+CSS"这种叫法其实是一种不准确的叫法,是国 ...

  3. jquery的css详解(二)

    jq的工具方法style用于设置样式,jq的实例方法css在设置样式时就是调用的它,接下来分析一下源码. jQuery.extend({ ............................ st ...

  4. css详解background八大属性及其含义

    background(背景) 以前笔者在css盒模型以及如何计算盒子的宽度一文中提到过盒模型可以看成由 元素外边距(margin).元素边框(border).元素内边距(padding)和元素内容(c ...

  5. css详解3

    推荐学习链接:css盒模型 1.盒模型的常用属性 1.1.pading <html lang="en"> <head> <meta charset=& ...

  6. jquery的css详解(一)

    通过阅读源码可以发现css是jq的实例方法.而在内部调用jq的工具方法access来实现的,对该方法不了解的朋友请点击 -> jquery工具方法access详解 在access的回调中做了一个 ...

  7. JavaWeb之CSS详解

    CSS的简介 1.CSS概述及作用 CSS:Cascading Style Sheets)是层叠样式表用来定义网页的显示效果.可以解决html代码对样式定义的重复,提高了后期样式代码的可维护性,并增强 ...

  8. Css详解之(伪类选择器)

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

  9. CSS之详解:active选择器

    Active的一段话 active的英文解释为"积极的",表现在鼠标上就是点击的意思.关于active选择器最多的示例恐怕就是应用在链接上面的,然而打开链接是一个一瞬间的动作,这不 ...

随机推荐

  1. Jmeter(二十)_Mock接口

    首先解释一下什么是mock接口. Mock通常是指,在测试一个对象时,我们构造一些假的对象来模拟与其交互.而这些Mock对象的行为是我们事先设定且符合预期.通过这些Mock对象来测试对象在正常逻辑,异 ...

  2. 用豆瓣镜像解决pip安装慢的问题

    pip3 install django==1.9 -i http://pypi.douban.com/simple/

  3. 有没有最好的学习Angularjs2的视频入门体验?

    Which are the best video tutorials for learning AngularJS 2? 有没有最好的学习Angularjs2的视频入门体验? 翻译来源:https:/ ...

  4. Linux文件格式化与相关处理及sed工具

    http://blog.csdn.net/pipisorry/article/details/52564957 geditor, sed, ed, awk, Emacs 文本处理工具 [Linux S ...

  5. Mybatis源码学习之TypeHandler

    ORM框架最重要功能是将面向对象方法中的对象和关系型数据库中的表关联了起来,在关联过程中就必然涉及到对象中的数据类型和数据库中的表字段类型的转换,Mybatis中的org.apache.ibatis. ...

  6. Nagle算法

    简介 Nagle算法是以他的发明人John Nagle的名字命名的,它用于自动连接许多的小缓冲器消息:这一过程(称为nagling)通过减少必须发送包的个数来增加网络软件系统的效率.Nagle算法于1 ...

  7. Dynamics CRM2016 Web API之通过实体的primary key查询记录(二)

    继续接上篇,还是通过primary key来查询数据,本篇介绍两个我个人比较喜欢的查询方式,一个是查询单个字段,一个是查询lookup关联实体中的属性字段. 先来看如何查询单个字段,只需要在url的最 ...

  8. EBS业务学习之库存管理

    库存管理业务流程 企业结构 库存结构 库存结构定义 指定每个子库存的特性: •子库存的数量跟踪 •资产类子库存 •保留子库存 •净值子库存 •包含在有效承诺中Include in ATP •子库存级库 ...

  9. tomcat中http与https协议socket工厂

  10. Dynamics CRM 非声明验证方式下连接组织服务的两种方式的性能测试

    今天看了勇哥的博文"http://luoyong0201.blog.163.com/blog/static/1129305201510153391392/",又认识到了一种新的连接 ...