CSS 分享 (4) Box model 等，實習
Download as PPTX, PDF1 like605 views
本文介紹了CSS和HTML的基本概念及其關係，強調HTML標籤作為框框的功能以及CSS如何用來改變這些框框的外觀和排版。文章細節包括CSS選擇符的用法、容器的屬性（如寬度、高度和邊距）以及背景的處理。最後，還提到了一些CSS特性，並給出了練習資源。
CSS 分享 (4) Box model 等，實習
- 13. HTML與CSS的關係可以只選一個框框，也可以一次選好幾個框框。p{ font-size:13px; }(群組)p, .block{ font-size:13px;}
- 14. HTML與CSS的關係還可以選框框裡的框框。(子嗣)#feature .block p{ font-size:13px;}
- 16. CSS能改變哪些特性#header{ height: 100px;}選擇符 屬性 值
- 17. CSS能改變哪些特性我們可以改變內容物的哪些特性呢？color, font-size, font-family, font-weightcolor 字的顏色 font-size 字級font-family 字型font-weight 粗細內容物的特性可以被子孫繼承。
- 18. CSS能改變哪些特性顏色碼的寫法 color: #00aadd (= #0ad)
- 20. CSS能改變哪些特性我們可以改變容器的哪些特性呢？width, height, margin, padding, border, backgroundmargin 外距topborder 框線padding 內距width 寬度height 高度leftrightheightwidthbackground 背景bottom容器的特性大多不會被子孫繼承。
- 21. CSS能改變哪些特性容器屬性的寫法margin: 15px 10px 5px 20px;上右 下 左 (順時針)margin: 15px 10px 5px;上 左右 下margin: 15px 10px;上下 左右padding 同 marginborder: 2px solid #0ad;(= #00aadd)粗細 款式 顏色
- 24. CSS能改變哪些特性背景屬性的寫法background-image: url(../images/bg.jpg);background-position: 15px 10px; ( 0 0 = left top)左 上(特殊) background-position:center center | right bottombackground-color: #0ad; (=#00aadd)background-repeat: no-repeat | repeat-x | repeat-y;background: #0ad url(../images/bg.jpg) no-repeat -5px -10px;背景色 背景圖 排列方式 左 上
- 27. Box Model標準IE6marginmarginpaddingLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitationpaddingLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodoheightheightwidthwidth
- 28. 容器的其他特性容器有兩種，block和inline。block容器會把整行空間佔滿。inline容器照著內容物變寬，且自動並排。h1spana span text textpHTML預設的inline容器只有<a>, <span>, <img>。uldisplay: block | inline;
- 29. 容器的其他特性容器可以改變寬度，然後浮動並排。float: left | right | none; 沒有設浮動的容器，即使寬度變窄也不會並排。
- 30. 容器的其他特性容器可以疊在其他容器上面。(外) position: relative;(內) position: absolute; (絕對定位)