HTML+css基础认识

标签：<div><span                                                                  
           css属性：width,height,padding:上下 左右;
margin:上 右 下 左;position:absolute/relative/fixed/static;

<p>                
                     
                     
                  
css属性：font-family,font-size,font-weight,font-style,color,text-decoration,text-align:justify;letter-spacing,word-spacing,

<a href=" "
target="_blank">
                                        
          css属性：color,text-decoration,

<img src=" "
alt=" " >                 
         
                
                 
css属性：padding,margin,vertical-align:text-bottom/text-top/middle;

<ul><li> <ol><li>        
                     
                     
                
css属性：float,display:block;background-position,list-style-type,list-style-image:url();

<table><caption><thead><tbody><tfoot><col><tr><th><td>  
css属性：border-collapse:collapse; table-layout:fixed; vertical-align:middle;

<iframe src="
">

<input type="
" name=" " value=" " align="
">                 
         css属性：back-ground-color:transparent;

　　                    
type:text,radio,checkbox,password,submit,reset,image,textarea,number,range,color,

<select name=" "><option value=" ">

伪元素：p:first-letter{} div:first-child{} a:link{} a:visited{} a:hover{}
a:focus{} a:active{}

属性选择器：img[width]{}

兄弟选择器：h1+p{} (选择所有紧跟在一个<h1>后的<p>元素)

派生选择器：div#greentea>blockquote p:first-line{}

图片替换：<span>Head Line</span>

span{display:none;}

body{background-image:url();

background-repeat:no-repeat;}

滑动门：<li><a
href="#"><strong>Home</strong></a></li>

#menu ul li a{display:block;

line-height:35px;

color:#ddd;

text-decoration:none;

padding:0 0 0 14px;}

#menu ul
li a:hover{color:#fff;

background:url() no-repeat right top;}

#menu ul li a
strong{display:block;

padding:0 14px 0 0;}

(IE中存在bug需增加#menu ul li a{float:left;})

HTML+css基础认识