[div]賴在家裡的賴家裡的家裡[/div]

《整理》原始寫法很長眼睛看了會花，之後要把Style整理出來包在<style></style>裡面
　　　　這樣html的部分才會乾淨，id用"#"表示、class用"."表示
　　　　以基本概念篇為例的語法整理過後為 ↓

　　　　<style>
　　　　.basic {
　　　　　position:absolute; background-color:#FDE437;　/*位置、底色*/
　　　　　width:300px; height:200px; 　　　　　　　　　　/*寬度、高度*/
　　　　　top:20px; left:50px;　　　　　　　　　　　　　　/*和頂點的距離、和左邊的距離*/
　　　　}
　　　　</style>

　　　　<div class="basic">基本div畫面</div>



　－－－也會有兩個以上不同的div中，有相同值的部分，可以再整理－－－－－－－－－－－－－－－－－－
　　　　在有相同值的div中(無論是id或class)，再多命名一個class，將相同的語法抓出來放在一起

　　　　<div id="sample" class="base"></div>　<!--若原本為id，增加class時要另外再寫出來-->
　　　　<div class="sample base"></div>　　　<!--若原本已是class，只需新增一個class名稱-->

　　　　以border邊框篇為例的語法整理過後為 ↓


　　　　<style>
　　　　.basic {
　　　　　position:absolute; background-color:#FFFF7D;　 /*位置、底色*/
　　　　　width:90px; height:40px;　　　　　　　　　　　  /*寬度、高度*/
　　　　　left:50px;　　　　　　　　　　　　　　　　　　  /*和左邊的距離*/
　　　　}
　　　　.border_dotted {
　　　　　border:dotted 3px #000000;　　　　　　　　　　/*邊框樣式、寬度、顏色*/
　　　　　top:20px;　　　　　　　　　　　　　　　　　　  /*和頂點的距離*/
　　　　}
　　　　.border_dashed {
　　　　　border:dashed 3px #000000;
　　　　　top:80px;
　　　　}
　　　　</style>

　　　　<div class="border_dotted basic">點線 dotted</div>
　　　　<div class="border_dashed basic">虛線 dashed</div>

　　　　兩個以上div共通點為.basic中的項目值，可以獨立出來，就不會一直重覆相同語法。

《註解》為了之後容易辨別自己寫了什麼，在語法旁加上隱藏註解 ↓
　　　　<!--註解在HTML中-->　　/*註解在CSS中*/　　//註解在JQuery中