前端常用方法

1、设定背景为固定图片，这样拉动滚动条时背景不会变化

body{background-image:url(./images/deskbg.png) ;background-attachment: fixed;}

 

2、链接锚点，实现链接到页面顶部、到页面底部 功能

<a href="#bottom" id="top">到页面底部</div>

 

<a href="#top" id="bottom">到页面顶部</div>

 

3、光标设置
style="cursor:pointer"
pointer:手式           auto/text:文本光标
crosshair：十字交叉    move:移动光标
wait:漏斗等待          help：帮助（问号）
default:默认鼠标

e-resize：水平拉伸（东西）     ne-resize：东北方向
n-resize：上下拉伸（南北）     nw-resize：西北方向
s-resize：上下拉伸（南北）     se-resize：东南方向
w-resize：水平拉伸（东西）     sw-resize：西南方向

4、css3背景颜色
 background:rgba(255,255,0,0.5) 0.5是透明度

5、字体设置
font:font-style(字体风格:正常/斜体),font-variant(字体变形:大写/小写),font-weight(字体粗细),fontsize/line-height,font-family(字体)
           
font-style:字体风格。  normal:正常   italic 斜字体   oblique:倾斜。 （若不存在斜字体italic，可使用oblique使字倾斜）
font-weight:normal bold  100-900 9级。400为正常字体， normal；   700为bold 
font-size:  100%为16px.      1em等于默认字号(父元素字号).  pt为打印样式表尺寸，非屏幕显示样式尺寸

6、背景   
background:background-color,background-image,background-repeat,background-attachment,background-position;

7、文本
words-spacing:字、单词间隔     letter-spacing:字母间隔
text-indent:首行缩进
white-space:设置空白属性（默认多个空格回车会变显示为一个或忽略，可用此属性来设置）
            pre（正常显示原有的空格，回车）;nowrap:非断行;
word-wrap:break-word;文本太长拆分，并换行。
text-align: left/right/center(居中)/justify(两边对齐)
text-transform:文本处理。   none/uppercase(全大写)/lowercase(全小写)/capitalize(每个单词第1个字母大写)
           
 8、css3设圆角：
   -ms-border-radius :  20px /10px   水平/竖直 
   -moz-border-radius :5px        
   -webkit-border-radius:5px
   -o-border-radius:5px;   
   border-radius:5px;
9、设置阴影：
   文本 text-shadow:10px 10px 20px #f00;
 元素： box-shadow:10px 10px 20px #f00;