另外,不要心急想一次學好所有語言,建議專心一次學一種就好
不是說混著學會學不好,只是許多語言之間只是格式上的變換,功能都很相似
應用時容易在觀念上重疊,有時出現一些奇怪的小錯誤(例如把html的語法搞成css..)
不要覺得說只是一些小錯誤而以無傷大雅,等你debug的時候可就笑不出來了...
有時真的是一個中括弧、一個空白、一個冒號..就足夠耗上不少時間(笑)
基本架構標籤
<!doctype html> 宣告文件類型為html
<html> </html> 文件開始與結束的地方,要寫在網頁裡面的任何資訊就放在裡面吧
<head> </head>文件的頭部,通常會放入<title>網頁的標題
<body> </body>主體部分,你想出現的一切東西都放在裡面
<h1> ~ <h6> 6個預設帶有粗體效果的標題,由大至小
<p> </p> 段落 (區塊元件:自成段落) (行內元件:運用在段落裡面)
<a href="URL"> 要顯示的連結文字/圖片</a> 超連結
<img src="圖片的URL(相對/絕對位置)"/>放入圖片
hmtl語法的組成
簡單來說,html的語法是由標籤,屬性,屬性值 三者所組成
以下列這一個<p>為例:
<p style="font-size:12px">文字內容</p>
標籤:p 屬性:font-size 屬性值:12px
基本上每一個標籤都是成雙成對的*,一個開頭與一個加入/符號的結尾(<p>...</p>)
style=只是一個前置元素,代表說我們要賦予p屬性,整個屬性與屬性值由 " " 包裹起來
屬性這裡font-size舉例的是設定字體大小,屬性與屬性值之間透過:冒號隔開,
而屬性值12px這裡舉例的是我們要設定的大小為12px
白話來說明設一段:段落元素設定字體大小為12
*沒有成對的標籤又稱空標籤,本身是沒有訊息內容的標籤,像是img或是br等等
段落屬性應用(可應用在 <p> <h> <li> 等各種文字)
<p> 內容 </p> 一般段落格式
<p style="color:red"> 內容 </p> 字體顏色(舉例為紅色)
<p style="font-family:arial"> 內容 </p> 字形設定(舉例為arial字體)
<p style="background-color:blue"> 內容 </p> 段落背景顏色(舉例為藍色)
html標籤有各種屬性,族繁不齊備載,這邊只舉例部分應用情況
想了解更多可以到w3school裡面或者運用你的搜尋引擎找找
對齊
"text-align:left" "text-align:center" "text-align:right"
置左 置中 置右
粗體
<strong> 這裡的文字會是粗體 </strong>
斜體
<em> 這裡的文字會是斜體 </em>
引言
<blockquote> 這裡的文字會自成一個段落並斜體 </blockquote>
與em很像,但他會自成一個縮排的段落,所以還是要視使用時機來運用
如果你是段落內的某些字要斜體,建議用em
如果你是整段要獨立出來,並有縮排效果的話,那就是用他了
項目符號
<ol> </ol> 帶有數字項目符號的"有序列表"
<ul> </ul> 帶有黑點項目符號的"無序列表"
<li> </li> 項目內容
沒有留言:
張貼留言