1. CSS?
CSS Cascading Style Sheets(?? ???: Cascading Style Sheets)? HTML?? XML ?? ?? ???? ???? ? ???? ??? ?????. CSS3? CSS2? ????? ????, 3? CSS2.1? ???? ?? ??? ? ??? ?? ??? ????. ?? ?? ????? Chrome, Safari, Firefox, Opera ? ??? 360? ?? CSS3? ???? ??? ???? ???, IE10? CSS3? ???? ???? ??? ????. ?????? ?? ???? ??? ? ????. ?? CSS ?? ?? ??? ?? W3C ??? ??? ?? ???? ????? ?? ????? ?? ?????. ?? ?? ??? ?????? ???? ???? ??? ? ?? ???? ???? ??? ???? ?????.
<span style="color: #800000;">-moz-transform:translateX(20px); -webkit-transform:translateX(20px); -ms-transform:translateX(20px); transform:translateX(20px);</span>
Transform? CSS3? ??? ????, ? ????? ?? ???? ?? ???? ???? ???.
2.CSS? ? ? ?? ?
- ???? HTML ??? ???? ??? ?????.
- CSS? ??? ???? ????? ???? ?? ?? ??? ??, ? ? ?? ????? ????? ???? ?? ? ????. ?? ?? ?? ???, ?? ???, ??? ??? ? ?? ???, ??, ????? ?? ????.
- CSS? ????? ???? ??? ????? ????? ?? ??? ??? ????? ? ?? ??? ?? ??? ?????.
- ???? ?? ???? ???? CSS ??? ???? ??? ? ????. CSS ??? ?? ??? ???? ?? ???? ?? ???? ?? ?? ?????.
- ??: ??? ??? ?????.
<span style="color: #008000;">/*</span><span style="color: #008000;"> style.css </span><span style="color: #008000;">*/</span><span style="color: #800000;">
body</span>{<span style="color: #ff0000;">
background-color</span>:<span style="color: #0000ff;">#ccc</span>;
}<span style="color: #800000;">
h1</span>{<span style="color: #ff0000;">
font-size</span>:<span style="color: #0000ff;">16px</span>;<span style="color: #ff0000;">
font-family</span>:<span style="color: #0000ff;">"微軟雅黑"</span>;<span style="color: #ff0000;">
font-weight</span>:<span style="color: #0000ff;">normal</span>;
}
<span style="color: #008000;"><!--</span><span style="color: #008000;"> index.html </span><span style="color: #008000;">--></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">head</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">link </span><span style="color: #ff0000;">rel</span><span style="color: #0000ff;">="stylesheet"</span><span style="color: #ff0000;"> href</span><span style="color: #0000ff;">="./style.css"</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"></</span><span style="color: #800000;">head</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">body</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">h1</span><span style="color: #0000ff;">></span>這是標(biāo)題<span style="color: #0000ff;"></</span><span style="color: #800000;">h1</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"></</span><span style="color: #800000;">body</span><span style="color: #0000ff;">></span>
3.CSS ?? ??
CSS ??? ? ?? ?? ??, ? ????? ???? ????? HTML ??? ???? ?? ??? ???? ?????. ? ??? ??? ??? ?????. ??? ????? ??? ?????. ? ???? ?? ????. ??? ?? ???? ?????.
<span style="color: #800000;">p</span>{ <span style="color: #008000;">/*</span><span style="color: #008000;"> 選擇器 </span><span style="color: #008000;">*/</span><span style="color: #ff0000;">
color</span>:<span style="color: #0000ff;">red</span>; <span style="color: #008000;">/*</span><span style="color: #008000;"> 屬性:值; </span><span style="color: #008000;">*/</span>
}
4. CSS ??
??? ??? ???? ? ?? ??? ????.
- ?? ?????
- ?? ?????
- ??? ???
4.1 ?? ??? ??
?? ??? ??? ???? ?? ???? ???? ? ? ??????. ?? ??? ??? ???? ?? ??? ???? ?? ???? ??? ??? ? ????. ? ???? ??? ???? ??? ??? ?????. (???) ??? ?? ??:
<span style="color: #800000;"><head> <link rel="stylesheet" type="text/css" href="style.css"> </head></span>
4.2 ?? ??? ??
?? ??? ??? ???? ??? ?? ?? ??? ??? ???? ???. ?? ??? ???