文档章节

CSS 简介01

Geeks_Chen
 Geeks_Chen
发布于 2016/05/26 09:53
字数 672
阅读 16
收藏 1
css

一、css组成

选择器{

属性:值;//说明

}

二、分类(三种)

内联式、嵌入式、外部式

内联式:直接把css代码写在现有的html标签中;

嵌入式:可以把css代码写在<style type="text/css"></style>标签之间,一般将css样式嵌入<head></head>标签之间;

外部式:css代码写在一个单独的文件,这个css样式文件以.css为扩展名,在<head></head>标签之间通过引入<link href="base.css引用位置" rel="stylesheet" type="text/css" />

说明:在相同权值的情况下,内联式>嵌入式>外部式;(就近原则)

三、选择器分类

1.标签选择器:html代码中的标签

2.类选择器:.类选择器{ }

使用class = “类选择器名称”为标签设置一个类

3.id选择器:#选择器{  }

使用id = “ID名称”为一个标签设置

说明:id和class都可以应用任何元素;ID选择器只能在文档中使用一次,类选择器可以使用多次;类选择器可以为一个元素设置多个样式。

4.子选择器:(>),用于选择指定标签元素的第一代子元素

.first > span{color:red;}

5.包含(后代)选择器:加入空格,用于选择指定标签元素下的后辈元素。

.first span{color:red;}

说明:子选择器仅是指他的直接后代(儿子),后代选择器可以作用于所有子后代的元素(儿子,孙子,重孙等);> 作用元素的后一代,空格作用于元素的所有后代。

6.通用选择器:*

它使用*号。能够匹配所有的html标签。

7.分组选择符:,

多个标签元素设置同一个样式时,可以使用分组选择符(,)

h1,span{color:red;}

四、特性

1.继承:css央视具有继承性,继承是一种规则,它允许该样式不仅应用于某个特定的html标签元素,而且应用与它的后代。

2.特殊性:有的时候同一个标签我们给了多个样式,那么元素会采用哪种样式,取决于这个样式的权值,标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100.

3.层叠:如果html文件中某个元素有多个css样式,并且这些css样式具有一样的权重,这个时候就取决于这些css样式的顺序,处于最后面的css会被应用。

4.重要性:!important。采用这种方式说明这个样式权重最高。

© 著作权归作者所有

上一篇: CSS 简介02
下一篇: iOS 视频播放
Geeks_Chen
粉丝 3
博文 20
码字总数 9855
作品 0
朝阳
程序员
私信 提问
洗洗回家睡吧/cfchl

简介 cfchl 是一款代码高亮显示的JS插件或组件,不依赖第三方类库。 使用方法 引入cfchl.js,array.js 建立顶层容器及代码块,顶层容器类名为 cfchl 实例化cfchl,通过render()方法初始化参数,...

洗洗回家睡吧
2017/10/11
0
0
python3爬虫基础-pyquery解析库

简介 看名称和jQuery比较接近,对没错,pyQuery允许您对XML文档进行jQuery查询。API尽可能类似于jQuery。pyquery使用lxml进行快速XML和html操作。支持CSS选择器,操作在查找和操作HTML上是非常...

ZHAO_JH
05/19
9
0
前端开发.Html5.HTML5简单概述

HTML5的简介? 1.HTML5是HTML4.01和XHTML1.0之后的超文本标记语言的最新版本,它由一群自由思想者组成的团队设计出来,并最终实现多媒体支持,交互性,更加智能的表单,以及更好的语义化标记 2.HT...

满满李
2016/06/13
43
0
一个非常不错的layer JavaScript插件的使用

一个非常不错的 layer JavaScript 插件的使用–layUI 01.简介 在学过html,css,JavaScript之后,现在也越来越喜欢做出一些比较炫酷的东西,然而无奈自身能力有限,最近自己做一个了小小的jav...

meiqi0538
2018/04/09
0
0
前辈们,简历这样写行么?

于* 男 |未婚 |1990年5月生 |户口:吉林四平 |现居住于吉林四平 |身份证: 22032319900******** 邮编: 153389******(手机) E-mail: g**@163.com 网站: 求职意向 工作性质:全职 期望职业:...

崩子皆蔓
2014/01/23
1K
22

没有更多内容

加载失败,请刷新页面

加载更多

Excption与Error包结构,OOM 你遇到过哪些情况,SOF 你遇到过哪些情况

Throwable 是 Java 中所有错误与异常的超类,Throwable 包含两个子类,Error 与 Exception 。用于指示发生了异常情况。 Java 抛出的 Throwable 可以分成三种类型。 被检查异常(checked Exc...

Garphy
29分钟前
2
0
计算机实现原理专题--二进制减法器(二)

在计算机实现原理专题--二进制减法器(一)中说明了基本原理,现准备说明如何来实现。 首先第一步255-b运算相当于对b进行按位取反,因此可将8个非门组成如下图的形式: 由于每次做减法时,我...

FAT_mt
昨天
6
0
好程序员大数据学习路线分享函数+map映射+元祖

好程序员大数据学习路线分享函数+map映射+元祖,大数据各个平台上的语言实现 hadoop 由java实现,2003年至今,三大块:数据处理,数据存储,数据计算 存储: hbase --> 数据成表 处理: hive --> 数...

好程序员官方
昨天
7
0
tabel 中含有复选框的列 数据理解

1、el-ui中实现某一列为复选框 实现多选非常简单: 手动添加一个el-table-column,设type属性为selction即可; 2、@selection-change事件:选项发生勾选状态变化时触发该事件 <el-table @sel...

everthing
昨天
6
0
【技术分享】TestFlight测试的流程文档

上架基本需求资料 1、苹果开发者账号(如还没账号先申请-苹果开发者账号申请教程) 2、开发好的APP 通过本篇教程,可以学习到ios证书申请和打包ipa上传到appstoreconnect.apple.com进行TestF...

qtb999
昨天
10
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部