整理了慕課網的 初識HTML+CSS課程 筆記，針對HTML架構及標籤和CSS基本知識有更深入的了解，記錄下來學習中所獲得的重要筆記供大家學習。
教學1：
HTML x CSS x JS
- HTML(內容)：文字，圖片
- CSS(外觀)：字體，背景，邊框
- JS(行為)：特效
教學2：
字體修改優先順序以內連式 > 嵌入式 > 外部式，簡單來說就是就近原則。
- 字體修改(嵌入式，放置在head的style type內)
<html>
<head>
<style type="text/css">
h1{
font-size:12px;
color:#930;
text-align:center;
}
</style>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>
- 字體修改(內連式，直接寫在現有的HTML標籤中)
<html>
<head>
</head>
<body>
<span style="color:blue">Color blue!</span>
</body>
</html>
- 字體修改(外部式，寫在一個單獨的文件中)
<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css" />
</style>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>
# 單獨文件 "style.css"
span{
color:blue;
font-size:30px;
}
教學3：
class和id選擇器
<html>
<head>
<style type="text/css">
#stress{
color:red;
}
</style>
</head>
<body>
<span id="setGreen">公開課</span>
</body>
</html>
教學4：
增加<div id=”ListName”>來讓邏輯更清楚(如右圖比左圖來得更容易理解)
教學5：
元素分類
- 塊級元素：<div>、<p>、<h1>、<form>、<ul>、<li>
- 內聯元素：<span>、<a>、<label>、<strong>、<em>
- 內聯塊狀元素：<img>、<input>
延伸閱讀：
那 [學習筆記] 初識HTML+CSS入門教學 就到這邊，感謝收看，有關Max行銷誌的最新文章，都會發佈在Max的Facebook粉絲專頁，如果想看最新更新，還請您按讚或是追蹤唷！