4 ways to use CSS:
1. inline:
<p style="color:#F00; font-size:12px;"></p>
2. embedded:<head>
<style type="text/css">
…….
</style>
</head>
3. link
<link type="text/css" rel="stylesheet" href="style.css"/>
4. import
@import import css file while initialization be a part of a file
selector:
tag: p{ }
id: #one{ }
class: .one{ }
general: *{ }
nested selector: #div1 p a {color:#900;}
block vs inline
blockinline
width & heightYESNO
allow others be in same lineNO
YES
inline to block: display:block;
margin: 1px 2px 3px 4px; top right bottom left ( t r ou b l e)
clear float:
.clear{ clear: both;}
<div class="clear"></div>
vertical center:
line-height = height (text)
absolute position:
margin-left = -width/2
margin-right = -height/2
position:absolute;
top:50%;
left:50%;
(if parent element exists, parent element’s position should be relative)
Text horizontal center:
text-align: center;
Reset:
tags reset: *{margin:0px; padding:0px;} body,div,p,a,ul,li{margin:0px; padding:0px;} (groupdeclaration)
img border reset: img{border:none;}
font size reset: h1{font-size:100%;}
Pseudo classes:
:link (unvisited links)
:visited (visited links)
:active (clicked link)
:hover (mouse above)
,只是需要垮上后座的勇气和一颗想走即走的心,