CSS的全称是Cascading Style Sheets,层叠样式表
它用来控制HTML标签的样式，在美化网页中起到非常重要的作用
CSS的编写格式是键值对形式的，比如
color : red
background-color : blue
font-size : 20px
冒号左边的是属性名，冒号右边的是属性值
CSS三种书写方式
行内样式：（内联样式）直接在标签的style属性中书写
<span style="color:red;background-color:red;">123</span>
内页样式：在本网页的style标签中书写
<span>123</span>
<style type="text/css">
span {
color:yellow;
background-color:blue
}
</style>
外部样式：在单独的CSS文件中书写，然后在网页中用link标签引用
test.css
span {
color:yellow;
background-color:blue
}
test.html
<span>123</span>
<link rel="stylesheet" herf="test.css">
CSS选择器
选择器的作用
选择对应的标签，为之添加样式
标签选择器 根据标签名找到标签
类选择器 标签可以有多个类
id选择器 id是唯一的，不能一样
选择器组合 中间不留空格，粘在一起
后代选择器 中间一个空格，不管嵌套多少层
相邻兄弟选择器
属性选择器
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
/*标签选择器*/
p{
color:red;
}
/*类选择器*/
.first{
color:red;
}
.second{
color:blue;
}
/*id选择器*/
#first{
color:yollew;
}
#second{
color:green;
}
/*群组选择器*/
.first, #second, h1{
}
/*选择器组合*/
div.first{
}
/*后代选择器*/
div p{
}
/*子标签选择器*/
div > p{
}
/*相邻兄弟选择器*/
div ＋ p{
}
/*属性选择器*/
div[name]{
}
div[name][age]{
}
div[name="jack"]{
}
</style>
</head>
<body>
<div>
<p>p1</p>
<span>
<p>p2</p>
</span>
</div>
<div name="jack">div1</div>
<div age="10">div2</div>
<p>与div相邻的p</p>
<div>123</div>
<div id="first">123</div>
<p class="first second">123</p>
<p id="second">123</p>
<h1>hhh</h1>
</body>
</html>
猜你喜欢
联络方式：
深圳 · 龙岗 · 大运软件小镇22栋302-308
电话：400 1828 580
邮箱：szhulian@qq.com
-
PHP工程师面临成长瓶颈
先明确这里所指的PHP工程师，是指主要以PHP进行Web系统的开发，没有使用其的语言工作过。工作经验大概在3~4年，普通的Web系统(百万级访问，千成级数据以内或业务逻辑不是特别复杂)开发起基本得心应手，没有什么问题。但他们会这样的物点
-
讨论高端网站建设和一般网站有什么区别
现如今大部分的公司都有着自己的网站了，可是不一样岗位、不一样网站中间的品质间距是十分大的，效命型、比赛强烈的有整体实力的公司通常寻找高端网站建设，而新塑造公司因为有关网站建设观点不及时一般全是选择一般网站建设。小编认为网站建设部分高端和一般，这仅仅意味着不一样客户对网站的要求罢了。
-
小程序让客户快速吸引流量的方法
小程序正在成为平台标配和互联网基础设施。2018年6月小程序只有微信小程序和快应用，到2019年6月，360小程序最后加入战场后，市面上已经9家小程序平台，几乎主流的互联网平台都有了自己的小程序...
-
JavaScript中this关键字的深入分析说明
this关键字的定义this是Javascript语言的一个关键字，普通定义：当前发生事件的对象。通俗定义：当前的方法属于谁。全局作用域中的this...
-
四种常见物流网站建设方法
现如今，建站方式层出不穷，每个企业也会根据自己企业的特色来选择适合自己发展的建站方式，那么，物流网站建设都有哪些方式呢？下面我们就来给大家介绍几种不一样的建站方式，希望从这些建站的类型中你能够找到一个合适的
