Css详解之(选择器)
<!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详解之(选择器)的更多相关文章
- CSS详解
Web前端开发css基础样式总结 颜色和单位的使用 颜色 用颜色的名字表示颜色,比如:red 用16进制表示演示 比如:#FF0000 用rgb数值表示颜色,rgb(红,绿,蓝),每个值都在0-255 ...
- DIV+CSS详解
DIV+CSS详解 ✪DIV+CSS"这种叫法其实是一种不准确的叫法 在做笔记的最前面必须先给大家纠正一个错误,就是"DIV+CSS"这种叫法其实是一种不准确的叫法,是国 ...
- jquery的css详解(二)
jq的工具方法style用于设置样式,jq的实例方法css在设置样式时就是调用的它,接下来分析一下源码. jQuery.extend({ ............................ st ...
- css详解background八大属性及其含义
background(背景) 以前笔者在css盒模型以及如何计算盒子的宽度一文中提到过盒模型可以看成由 元素外边距(margin).元素边框(border).元素内边距(padding)和元素内容(c ...
- css详解3
推荐学习链接:css盒模型 1.盒模型的常用属性 1.1.pading <html lang="en"> <head> <meta charset=& ...
- jquery的css详解(一)
通过阅读源码可以发现css是jq的实例方法.而在内部调用jq的工具方法access来实现的,对该方法不了解的朋友请点击 -> jquery工具方法access详解 在access的回调中做了一个 ...
- JavaWeb之CSS详解
CSS的简介 1.CSS概述及作用 CSS:Cascading Style Sheets)是层叠样式表用来定义网页的显示效果.可以解决html代码对样式定义的重复,提高了后期样式代码的可维护性,并增强 ...
- Css详解之(伪类选择器)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- CSS之详解:active选择器
Active的一段话 active的英文解释为"积极的",表现在鼠标上就是点击的意思.关于active选择器最多的示例恐怕就是应用在链接上面的,然而打开链接是一个一瞬间的动作,这不 ...
随机推荐
- 阿里云linux下web服务器配置
markdown截图不方便,本教程不用markdown编写 首先参考文章 https://www.jianshu.com/p/2604e53a7f6a?from=singlemessage 安装完后无 ...
- JavaScript while 循环
JavaScript while 循环的目的是为了反复执行语句或代码块. 只要指定条件为 true,循环就可以一直执行代码块. while 循环 while 循环会在指定条件为真时循环执行代码块. 语 ...
- Sybase数据库实现等效的mysql中group_concat功能
在MySQL中,如果想实现将分组之后的多个数据合并到一列,可以使用group_concat函数,如下图所示: 但是,在Sybase中没有这样的函数(别问我为什么使用Sybase,因为公司用的Sybas ...
- springMVC源码分析--ViewNameMethodReturnValueHandler返回值处理器(三)
之前两篇博客springMVC源码分析--HandlerMethodReturnValueHandler返回值解析器(一)和springMVC源码分析--HandlerMethodReturnValu ...
- Android源码解析——Toast
简介 Toast是一种向用户快速展示少量信息的视图.当它显示时,它会浮在整个应用层的上面,并且不会获取到焦点.它的设计思想是能够向用户展示些信息,但又能尽量不显得唐突.本篇我们来研读一下Toast的源 ...
- linux:如何指定进程运行的CPU
coolshell最新的文章<性能调优攻略>在"多核CPU调优"章节,提到"我们不能任由操作系统负载均衡,因为我们自己更了解自己的程序,所以,我们可以手动地为 ...
- Spark:相关错误总结
http://blog.csdn.net/pipisorry/article/details/52916307 路径错误 spark FileNotFoundError: [Errno 2] No s ...
- Android学习路线指南
看到这位大牛的博文,不禁得感概,我最近也遇到了很多问题,内心彷徨不堪,转载大牛这篇博文,是为了更好的勉励自己.原文地址在最后面. 前言 看到一篇文章中提到"最近几年国内的初级Android程 ...
- Dynamics CRM2015 Update1 新功能之表单增强功能
CRM2015 Update 1发布后,系统的界面的变化很大,仔细观察后会发现表单窗体也有些不同了,在CRM2015 Update1的官方介绍中对此变化的解释是起用了新的窗体呈现引擎,让界面更好看加载 ...
- 【环境配置】配置maven
Maven是基于项目对象模型(POM),可以通过一小段描述信息来管理项目的构建,报告和文档的软件项目管理工具. Maven 除了以程序构建能力为特色之外,还提供高级项目管理工具.由于 Maven 的缺 ...