CSS之美化页面

CSS之美化页面

　　<span></span> 标签

　　<span>行内定义一个区域 　就是说一行可以被<span>划分多个小区域，从而实现某种特定效果。<span>本身并不具备属性。

　　<sapn>和<div> 是相似的　　<span> 在从CSS中 属性行内元素    而<div>属于块级元素

　　什么是行内元素：  “标签可以在一行内”。

　　什么是块级元素：“标签自己独占一行”。

样式

　　1.字体样式

　　font-size　　　　　　字体大小

　　font-family　　　　　字体类型　　属性值有：黑体，宋体，微软雅黑，以及英文vaesea

　　　　　　　　　　　　　　　　　　可以把多个字体名称作为一个   回退系统来保存，如果浏览器不支持第一个，就回退到第二，第三个....

　　font-weight　　　　  字体粗细　　　　例如：font-size：bold;加粗       bolder 强调加粗   可以用数字代表    400表示正常 。   

　　font-style　　　　　 字体风格      normal   浏览器默认显示一个标准字体，  italic  倾斜字体      oblique  倾斜字体   

　　

　　组合写法：字体风格-->字体风格-->字体粗细-->字体大小-->字体类型

　　　　例如：font:oblique  bold  12px  "楷体";

　　2.文本样式

　　text-align　　　　文本对齐方式　　　　属性值：left    right    center     justify

　　text-indent     　　文本首行缩进          　属性值：2em，em 属于单位

　　text-decoration 　文本的装饰　　　　   属性值：underline   加下划线      none  去除下划线    overline  上划线     line-through：删除线     blink   文本闪烁  只有在firefox才行。

　　text-shadow　　文本阴影 　　　　　　属性值：5px  5px  5px  5px  gray;  分别是  横坐标  纵坐标  模糊程度   模糊范围  颜色

　　3.鼠标形状

　　default　　默认光标

　　pointer　　超链接的指针

　　wait　　　程序正在忙

　　.....

　　4.网页背景

　　background-color　　　　　背景颜色

　　background-image　　　　 背景图片

　　background-repeat　　　　背景重复方式 　　　　　属性值：repeat  沿水平和垂直两方向平铺     no-repeat   不平铺     repeat-x    只沿水平平铺     repeat-y    只沿垂直平铺

　　background-position　　　背景定位        　　　　　属性值：x      y      水平和垂直         x：left    center     right         y：top      center    bottom 

 

　　组合写法：background: red  url()  50px  50px  no-repaet;         分别是  背景颜色   背景图片   背景定位    背景重复方式

　　5.列表样式

　　list-style-type　　　　属性值：none；    取消标记，       disc  实心圆，     circle  空心圆 ，     square  实心正方形，   decimal   数字。

　　list-position　　　　属性值：inside    列表项目放置文本以内 ，且环绕文本根据标记对齐      outside    默认值    标记位于文本的左侧， 列表项目放置放置在文本以外 ，且环绕文本不根据标记对齐。