forked from ccccourse1/wp109b
-
Notifications
You must be signed in to change notification settings - Fork 0
week3.md
stereomp3 edited this page May 4, 2021
·
14 revisions
Please download 網頁設計第三次上課.docx to see the content picture of homework, thanks.
如果要使用CC (creative commons)
將以下HTML碼貼到你的網頁上，讓使用者知道你的授權方式
<a rel="license" href="http://creativecommons.org/licenses/by/4.0/"><img alt="創用 CC 授權條款" style="border-width:0" src="https://i.creativecommons.org/l/by/4.0/88x31.png" /></a><br />本著作係採用<a rel="license" href="http://creativecommons.org/licenses/by/4.0/">創用 CC 姓名標示 4.0 國際 授權條款</a>授權.
CSS
CSS Introduction
CSS是一種排版語言，可以讓網頁呈現比較美的感覺。內容和格式分開，網頁好維護。
CSS Syntax(語法)
CSS Selectors(選擇器)*
選擇器一共有3種
第一種無: 可以把指定的東西都加上屬性, 第二次上課有提過
第二種id : id具有唯一性, 一個詞在一份文件只能出現一次 .
第三種class : class可以指一整群, 只要有class標籤 .
下面是組合用法
CSS How to Add
CSS Comments
CSS註解表示方式 : /*…*/ , 不能使用//在CSS
Html註解表示方式 : <!--…-->
CSS Color
顏色不只可以用文字表示，也可以用RGB表示(第2次上課有提到)
表示背景顏色用"background-color:...", 而文字顏色用”color:…”
也可以設邊(border)的顏色
a是表示透明度
CSS Background
Opacity 是設置透明度， div是指區塊(會換行) EX:
<body>
<h1>這裡是網頁標題</h1>
<div>這裡是網頁第一個區塊的內容</div>
<div>這裡是網頁第二個區塊的內容</div>
...
</body>
Background-repeat:
CSS Box Model
CSS Borders
Width:
甚麼類型直接一次寫(最常用)
CSS Margins
Margin collapse
margin : 下左上右，也可以 margin : ..px
CSS Padding
Padding也可以上下左右不同大小(較少用)
CSS Height/Width
CSS Outline
用法和Box model 差不多
CSS Text
字體顏色和字左右對齊
設置陰影
CSS Fonts
自行一般都不會設，因為作業系統會有不一樣的設定
CSS Icons
可以先去網站找icon再用原始碼把它進去
CSS Links
: 繼承
CSS Lists
<ul>代表unorder list(點點)
<ol>代表order list(1.2.3….)
<li>代表list item
可以在文字的前面加一張圖
CSS Table
CSS Display
顯示的形式
不顯示直接影藏
一個接一個不換行
會換行
CSS Max-width
到達最大寬度就不再變化，通常用在電腦網頁和手機網頁共用的網站原始碼
CSS Position
static
relative
fixed
absolute
Sticky(別人往下它不會往下)
CSS Overflow
CSS Combinator
CSS Perview