css基础（1）

css的引入方式：

<link rel="stylesheet" href="文件路径.">

css选择器

基础选择器：

标签选择器

标签名 {   }

类名选择器，可以同时修改多个类，用逗号隔开

.类名 {    }

id选择器  id不可以重复

#id {      }

复合选择器

并集选择器 可以同时修改多个标签，用逗号隔开

标签名，

标签名，

...{          }

子元素选择器  修改父元素里面所有符合条件的子元素标签

父元素标签名>子元素标签名  {        }

复合伪类选择器

focus伪类选择器  一般修改input标签，当input获得光标时进行修改

input：focus {     }

链接伪类选择器  按照 l v h a顺序声明

a:link {    为访问的链接  }

a:visited {  访问过的链接     }

a:hover { 鼠标经过的链接   }

a:active{   鼠标点击还没有松手的链接   }

css样式

 font-family 设置字体

font-size 设置大小

font-weigth 设置粗细 400为正常粗细  标题标签需要单独设置

font-style  设置样式（斜体） normal默认值 italic 斜体

复合写法：样式，粗细，大小/行高，字体。font：normal 700 50px 微软雅黑' 有些属性可以不写，但size跟family必须写

 color 修改颜色

text-decortion 修饰文本 underline下划线 overline上划线

line-through删除线 none 默认。

 text-indent 段落首行缩进 2em 当前两个文字大小

line-height =高度  可以实现文字垂直居中。

text-align 文本内容水平对齐 left左 right右 center居中

css元素显示

display:block 转换为块级元素 

display:inline 转换为行内元素 

isplay:inline-block 转换为行内块元素 

 块元素

 div h1-h6 p ul ol li

特点：

  一个占一行。高宽，外边距，内边距都可以修改。

宽度默认值是父级宽度的100%

是一个容器，里面可以放其他元素。

行内元素

a strong b em i del s ins u span    

 特点：

一行可以显示多个。宽高直接设置无效。

默认宽度是他内容本身的宽度

 行内元素只能容纳文本或其他行内元素。

 行内块元素

img input td

特点：

一行可以显示多个，但他们之间会有空白间隙

默认宽度是他内容本身的宽度

高宽，外边距，内边距都可以修改。

css背景

background:颜色 地址 平铺 滚动 位置

插入背景图片

 background-image: url(路径);

背景平铺

background-repeat：repeat 平铺 ，no-repeat 不平铺 ，repeat-x x轴平铺 ，repeat-y   y轴平铺

背景固定

 background-attachment: scroll滚动 ，fixed固定

背景颜色

background-color: transparent;   背景颜色如果不写默认为transparent透明

背景位置

 background-position:方位名词或精确单位 ;

方位名词：top center botton left right center

 精确单位：百分数或px