欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

CSS回顾(基础知识,元素,选择器,盒子,颜色)

程序员文章站 2022-06-22 16:36:15
元素分类: 1.行级元素:内联元素 inline 特征:内容决定元素所占位置,不可以通过CSS改变宽高 span strong em a del 2.块级元素:block特征:独占一行,可以通过CSS改变宽高 div p ul li ol form address 3.行级块元素:inline-bl ......

元素分类:

1.行级元素:内联元素  inline

特征:内容决定元素所占位置,不可以通过css改变宽高

span  strong   em  a  del  

2.块级元素:block特征:独占一行,可以通过css改变宽高

div  p  ul  li  ol  form   address

3.行级块元素:inline-block

特征:内容决定大小,可以改变宽高

选择器类型(通用的,没写那些伪类):

父子选择器(派生选择器)

<div>

  <em></em>

    </div>

div em {margin:0px}  有父子关系的几个元素组成的选择器,div下的所有em子孙

直接子元素选择器

div>em { margin:0  }   表示的是div下的直接子元素

并列选择器

<div class='red'></div>

div.red{ color:green }   表示并列关系

权重值比较:<style='color=red'  ...>内联样式,1000

id :100 class:10 标签:1  *:0  ,!important是无穷大权重,但是如果!important+1则要更大

分组选择器

.demo{}    .red{}

!!解决图片间隔  margin-left:-6px

盒子组成部分:

盒子壁  border

内边距 padding

盒子内容 width+weigth

 

margin+border+padding+content

颜色:

1.纯英文单词    red,green

2.颜色代码       #00ff22

3.颜色函数  rgb(00,ff ,ff)

rgb()表示光的三原色,red, green ,blue