CSS用法简介
CSS(Cascading Style Sheets层叠样式表)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
1.基本使用语法
样式类别-方向-特征 : 值;
设置颜色:
color : red;
设置字体大小
font-size : 10px;
字体描述
text-decoration : overline;
2. CSS分类(如何使用CSS)
行内样式
直接给元素添加 style="" 属性
内嵌样式
直接给元素添加一个ID或一个class属性,在head标签中(不一定)写上
<style type="text/css">
</style>
在里面写上样式的语法,并与对应的元素挂钩
外部样式
在htm文件外有一个css文件,样式写在css文件中,在html页中将这个样式文件加载进来
<link href="css路径" rel="stylesheet" type="text/css" />
3.选择器(selecter)
id选择器
#id {
/* 样式 */
}
类选择器
.className {
/* 样式 */
}
标签选择器
tagName {
/* 样式 */
}
三个样式同时使用,如果没有样式冲突,都应用
如果有冲突,同级的就近原则
如果不是同级的,ID>类>标签(专一的优先级最大)
类选择器可以使用 class="c1 c2 c3 c4" 的语法将多个类选择器作用与元素上
不规范用法:
在CSS使用中,id选择器与类选择器可以同样的作用与多个元素
id在规范中就是表示唯一,浏览器允许这么使用,但是在js执行中会出现问题
复合选择器
标签类选择器
标签.类名 { /* 样式 */ }
后面兄弟选择器
选择器+* {
/* 选中前面元素选择器的后一个元素 */
}
(+号不能省略)
后代选择器
将包含在某个元素中的元素都称为其后代
<div id="dv1">
<p>123</p>
<div id="dv2">
<span id="span1"></span>
</div>
<p>456</p>
</div>
祖代选择器 后代选择器 {
/* 样式 */
}
子代选择器
父带选择器>子代选择器 {
/* 样式 */
}
组合选择器
选择器1, 选择器2, 选择器3, ..., 选择器N {
/* 这些选择器的元素都具有这个样式 */
}
4.常用样式
文本
color
font-size
font-family
font-weight
边框
border-color
border-style
border-width
背景
background-color
布局
其他
CSS用法简介的更多相关文章
- css012 css布局简介
css012 css布局简介 一. 网页布局的类型 网页布局的类型 1.固定宽度 2.流式 3.相应式web设计 二. 如何进行css布局 1.强大的<div>标签 网页的h ...
- IOS NSInvocation用法简介
IOS NSInvocation用法简介 2012-10-25 19:59 来源:博客园 作者:csj007523 字号:T|T [摘要]在 iOS中可以直接调用某个对象的消息方式有两种,其中一种就是 ...
- JodaTime用法简介
JodaTime用法简介 Java的Date和Calendar用起来简直就是灾难,跟C#的DateTime差距太明显了,幸好有JodaTime 本文简单罗列JodaTime的用法 package co ...
- Apache自带压力测试工具ab用法简介
ab命令原理 ab命令会创建很多的并发访问线程,模拟多个访问者同时对某一URL进行访问.它的测试目标是基于URL的,因此,既可以用来测试Apache的负载压力,也可以测试nginx.lighthttp ...
- CSS 选择器简介
前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! 选择器权重 如果以4位数表示选择符权重,那么: 元素选择器的权重是1: id 选择器的权重为100: cl ...
- Postman用法简介
转自:http://blog.csdn.net/flowerspring/article/details/52774399 Postman用法简介 转载 2016年10月10日 09:04:10 10 ...
- MSSQL Sql加密函数 hashbytes 用法简介
转自:http://www.maomao365.com/?p=4732 一.mssql sql hashbytes 函数简介 hashbytes函数功能为:返回一个字符,通过 MD2.MD4.MD5. ...
- java assert的用法简介【转】
assert的基本用法 assertion(断言)在软件开发中是一种常用的调试方式,很多开发语言中都支持这种机制,如C,C++和Eiffel等,但是支持的形式不尽相同,有的是通过语言本身.有的是通过库 ...
- glVertexAttribPointer 用法简介
在内存中采用交叉模式存储,向gpu传入顶点数据的方法 GPU: #version 100 attribute highp vec2 aPosition; attribute highp vec2 a ...
随机推荐
- Delphi通过调用COM对象实现更改桌面壁纸
从前我也是用SystemParametersInfo这API来改桌面壁纸的,问题多多,也不知道哪错了,就没深究下去.看了CSDN的帖子后,大彻大悟~~ 在XP下,SystemParam ...
- php date操作
date(format,timestamp) d - 月中的天 (01-31) m - 当前月,以数字计 (01-12) Y - 当前的年(四位数) h 小时,12 小时格式,有前导零 01 到 12 ...
- 关于TCP封包、粘包、半包
关于Tcp封包 很多朋友已经对此作了不少研究,也花费不少心血编写了实现代码和blog文档.当然也充斥着一些各式的评论,自己看了一下,总结一些心得. 首先我们学习一下这些朋友的心得,他们是: http: ...
- nginx-gridfs 的安装配置和使用
(一)安装nginx前的准备 安装nginx需要安装openssl和pcre,具体安装步骤请参考nginx安装的相关博文 (二)nginx和nginx-gridfs 联合编译安装 nginx-grid ...
- PLA能收敛的证明
题:如果资料D线性可分,PLA如何保证最后能得到最优解. 思路:假设$w_f$能够分割资料D,$w_{t+1}$经过更新$w_{t+1}=w_t + y_{n(t)}x_{n(t)}$后,与$w_f$ ...
- 安装virtualbox虚拟机的增强功能
转自:http://wubangtu.com/714 最近有很多人问我这个问题,现在全部写在这里,免得到时候又啰嗦一遍了,哈哈.欢迎大家前来围观: 安装virtualbox虚拟机的增强功能可以实现如下 ...
- AndroidUI 视图动画-旋转动画效果 (RotateAnimation)
RotateAnimation,能实现Android的视图的旋转效果,废话不多说直接上代码. 新建一个Android 项目,在activity_main.xml中添加一个按钮,然后使用Relative ...
- SQL 数据类型、约束、索引及视图
一.数据类型:整数:int,bigint,smallint小数:float,real,decimal(长度,精度),numeric(长度,精度)字符:char(n),varchar(n) 8000英文 ...
- SSIS之数据转换用法
当SSIS报错为:“无法在unicode和非unicode字符串数据类型之间转换”,可以考虑用数据转换器实现,很简单,如下图: 第一步,找到数据转换器: 第二步,编辑数据转换器: 第三步:编辑目标映射 ...
- 初识-Android之智能短信项目相关技术整理
标签页切换采用传统的TabHost: 采用TabActivty实现TabHost. 效果图-后补: 相关技术详解推荐: http://blog.csdn.net/zhouli_05/article/d ...