CSS 嵌入,及其选择器
CSS
1. CSS样式表的几种使用方式
1.元素内嵌
<p style="font-size"></p>
2.内部文档内嵌
<style type="text/css">
p{
font-family:Consolas;
font-size:24px;
}
</style>
<p> 这是个段落 </p>
这样<p>标签就会表现出内部文档内嵌样式表的样式
3.外部文档内嵌
<link rel="stylesheet" type="text/css" herf="css/test.css">
4.导入式
<style type="text/css">
// 导入式
@import “css/test.css”
</style>
注:
调用优先级别: 元素内嵌样式 > 内部文档内嵌 > 外部文档内嵌
2. CSS 选择器
- 选择所有元素
<!--style元素-->
<style type="text/css">
*{
}
</style>
- 根据类型选择元素
<!--style元素-->
<style type="text/css">
a{
}
p{
}
</style>
<!--body 元素-->
<body>
<a> test </a>
<p> Test </p>
</body>
- 根据类选择元素
<!--style 元素:-->
<style type="text/css">
.class1{
}
</style>
<!--body 元素:-->
<body>
<p class="class1">Test </p>
</body>
- 根据ID 选择元素
<!--style 元素:-->
<style type="text/css">
#id1{
}
</style>
<!--body 元素:-->
<body>
<p id="id1"> Test </p>
</body>
- 根据属性选择元素
<!--style 元素:-->
<style type="text/css">
[href]{
}
</style>
<!--body 元素:-->
<body>
<a herf="test.html"> Test </a>
</body>
- :选择器动作
<!--style 元素:-->
<style type="text/css">
a:hover{
}
</style>
<!--body 元素:-->
<body>
<a> Test </a>
</body>
CSS 嵌入,及其选择器的更多相关文章
- 23----2013.07.01---Div和Span区别,Css常用属性,选择器,使用css的方式,脱离文档流,div+css布局,盒子模型,框架,js基本介绍
01 复习内容 复习之前的知识点 02演示VS创建元素 03div和span区别 通过display属性进行DIV与Span之间的转换.div->span 设置display:inline ...
- CSS基础--属性选择器、伪类选择器
属性选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...
- CSS伪类选择器
一.CSS伪类选择器用于给某些选择器添加效果语法规则:选择器:伪选择器例:a:link {color: #FF0000} 未访问的链接 a:visited {color: #00FF00} 已访问的链 ...
- Lining.js - 为CSS提供 ::nth-Line 选择器功能
在CSS中,我们使用 ::first-line 选择器来给元素第一行内容应用样式.但目前还没有像 ::nth-line.::nth-last-line 甚至 ::last-line 这样的选择器.实际 ...
- CSS 子元素选择器与后代选择器区别实例讲解
css子元素选择器和后代选择器在功能描述上非常相同,但是他们其实是有区别的,本文章通过两个简单的实例向大家介绍子元素选择器与后代选择器的区别,需要的朋友可以参考一下. 首先我们来了解一下子元素选择器与 ...
- CSS的总结(选择器,伪类等...)
关于组合选择器可参考:http://www.cnblogs.com/starof/p/4453458.html 主要内容 CSS概述 CSS和HTML结合的四种方式 CSS样式优先级和代码规范 CSS ...
- 关于CSS伪类选择器
#CSS伪类选择器 ##使用css伪类选择器需要注意的 使用css的伪类选择器来选择某元素时,需要特别注意 :first-child 和 :nth-child(n) 等时, 网页渲染是从语句的后面开始 ...
- CSS之后代选择器与多类选择器
<新人报到,欢迎拍砖#- -> 一.后代选择器 说起CSS的后代选择器.它属于派生选择器中的一种,两者附属关系如下: -->派生选择器 ----CSS 后代选择器 ----CSS 子 ...
- jQuery的hover方法搭配css的hover选择器,实现选中元素突出显示
问题简述: 今天做帮一个师姐做网页遇到一个这样的要求: 鼠标不移动进表格,表格透明度不变. 鼠标移动进表格,hover到的单元格透明度不变,没hover到的单元格透明度改变. 先贴我已经实现好的效果, ...
- css的各种选择器
一.基本选择器 1. * 通用元素选择器,匹配任何元素 2. E 标签选择器,匹配所有使用E标签的元素 3. .info class选择器,匹配所有class属性中包含info的元素 4. #foot ...
随机推荐
- HttpClient-01基本概念
Http 协议应该是互联网中最重要的协议.持续增长的 web 服务.可联网的家用电器等都在继承并拓 展着 Http 协议,向着浏览器之外的方向发展. 虽然 jdk 中的 java.net 包中提供了一 ...
- YTU 2626: B 统计程序设计基础课程学生的平均成绩
2626: B 统计程序设计基础课程学生的平均成绩 时间限制: 1 Sec 内存限制: 128 MB 提交: 427 解决: 143 题目描述 程序设计基础课程的学生成绩出来了,老师需要统计出学生 ...
- POJ1279 Art Gallery 多边形的核
POJ1279 给一个多边形 求它的核的面积 所谓多边形的核 是多边形中的一个点集 满足其中的点与多边形边上的点的连线全部在多边形中 用多边形的每一条边所在的直线去切整个坐标平面 得到的一个凸包就是核 ...
- vue watcher
观察 Watchers 虽然计算属性在大多数情况下更合适,但有时也需要一个自定义的 watcher .这是为什么 Vue 提供一个更通用的方法通过watch 选项,来响应数据的变化.当你想要在数据变化 ...
- 基于ELK的传感器数据分析练习
目录 Sensor Data Analytics Application 数据构成 数据模型设计 Logstash配置 Kibana可视化 Sensor Data Analytics Applicat ...
- MySQL索引学习记录
参考资料: http://blog.csdn.net/v_july_v/article/details/6530142http://blog.codinglabs.org/articles/theor ...
- 使用IntelliJ IDEA 创建Maven项目(入门)
一. 下载Maven 下载地址:http://maven.apache.org/download.cgi tar.gz压缩格式用于unix操作系统,而zip用于windows的操作系统,但在windo ...
- 内核的ramdisk
ramdisk 内核中的特性之一,使用缓冲和缓存来加速对磁盘上的文件访问,并加载相应的硬件驱. ramdisk --> ramfs,提高速度 CentOS 5: initrd 工具程序:mkin ...
- 【BZOJ2525】[Poi2011]Dynamite(二分,树形dp)
[BZOJ2525][Poi2011]Dynamite Description Byteotian Cave的结构是一棵N个节点的树,其中某些点上面已经安置了炸.药,现在需要点燃M个点上的引线引爆所有 ...
- LINQ数据库技术
LINQ(Language Integrated Qyery),中文名字是语言集成查询.它提供一个统一的编程概念和语法,编程人员不需要关心将要访问的是关系数据库还是XML数据,或是远程的对象,它都采用 ...