第二课css基本样式与元素选择器
1什么是css
层叠样式表(Cascading Style Sheets,简称css)是一种用来为html文档添加样式
字体,间距,位置,颜色,角度等显示效果的计算机语言.
html是内容的展示,css是内容的装饰
2css的引用方式
1.行内样式:在开始标签的内部可以设置一个叫做style的属性,属性的双引号内存该元素代码css样式.
1.1写法:<div style="存放该元素的css样式代码"></div>
2.内部样式:在head标签中间新建一个style标签,该标签内部存放的就是网页文件中的css代码
2.1写法:
<head>
<style>/*层叠样式表:css,专门修饰网页显示效果*/
</style>
<head>
3.外部样式
3.1写法:<link rel='stylesheet' href='这里写css文件的地址'>(引用网页外部css文件)
3CSS代码的基本格式
1.元素/标签命名的基本格式
1.1<div class="box"></div> class命名:谁都可以取,可以取任意次
1.2<div id="boss"></div> id命名:只能唯一的,一旦使用不可二用.
2.css样式设置的基本格式
2.1选择器:选择元素的器具或是工具
2.2 class命名的元素使用:.box(.+元素名称)
2.3 ID命名的元素使用: #boss(#+元素名称)
2.4:或是直接写上标签的名称: div,p,h1等可以找到元素
4 css基本样式
1.常用样式类别
尺寸样式:宽:width 高:height
位置样式:水平位置: margin-left
margin-right
垂直位置:margin-top
margin-bottom
装饰样式:元素颜色:background-color
文字样式:文字大小:font-size
文字字体:font-family
文字颜色:color
css3样式
5常用复合选择器的使用
1.交集选择器:交集选择器由两个选择器构成,其中第一个为标签选择器,第二个为class选择器,两个选择器之间不能有空格如h3.box.
2.并集选择器:(css选择器分组)是各个选择器通过逗号连接而成的.
任何形式的选择器（包括标签选择器、class类选择器id选择器等），都可以作为并集选择器的一部分。如果某些选择器定义的样式完全相同，或部分相同，就可以利用并集选择器为它们定义相同的CSS样式。
3.后代元素选择器是一个空格,(空格前后各有一个人选择器)
作用是:找到空格前的选择器所选中的元素的后代元素中符合空格后选择器的元素
4.子代元素选择器
子代元素选择器是一个大于号,大于号前后各有一个选择器
作用是:找到大于号的选择器所选中的元素子元素中大于号后选择器要求的元素
5.相邻元素选择器
相邻元素选择器是一个+号,作用是:找到加号前的选择器所选中的元素紧跟其后一个符号+号后选择器选择中的元素
6.兄弟元素选择器
兄弟元素选择器是一个~号,作用是:找到~号前的选择器所选中的元素紧跟其后所有符合~号选择器选中的元素
6样式优先级
!important 最重
行内样式,权重 1000
ID选择器,单个权重100
类名选择器,属性选择器,伪类选择器 单个权重10
标签选择器,伪元素选择器 单个权重1
通配符选择器 关系选择器(+,>,~,"") 否定伪类 权重0
1634
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
