# HTML-CSS01-PM
- 為什么要學習HTML
- HTML和CSS是什么
- 常用的HTML標簽
- 常用的CSS樣式
- 盒子模型
## 1.為什么要學習HTML和CSS

網頁就是由HTML和CSS書寫而成
## 2. HTML和CSS是什么
把網頁比作一個房子

網頁就是由一個個HTML標簽組成

CSS樣式負責修飾HTML標簽
## 3.了解HTML標簽
```
//開始標簽
<body>
</body>
//結束標簽
```
## 4.HTML標簽的特點:語義化
(https://blog.csdn.net/njcgosling/article/details/47130723
)
## 5.常用的HTML標簽
```
h1~h6,p,img,div,a,input,button,ul,li,dl,dt,dd
```
## 6.常用的css樣式
### 6.1 css的語法

```
selector {property: value}
selector選擇器通常是您需要改變樣式的 HTML 元素
屬性(property)是您希望設置的樣式屬性(style attribute)
eg:
//HTML
<h1>hello world</h1>
//css
h1 {color:red; font-size:14px;}
```
### 6.2css常用選擇器
```
<p class="one" id="two">hello world</p>
p{} //元素選擇器
p.one{} //class選擇器
p#two{} //id選擇器
```
### 6.3盒子模型
```
//元素居中僅僅針對塊元素有效
margin-left:auto;
margin-right:auto;
```
### 6.4樣式重置
```
*{margin:0;padding:0}
```
### 6.5常用的css樣式
```
color:設置文字的顏色
width:設置一個元素的寬度
height:設置一個元素的高度
background-color:設置背景顏色
background-image:設置一個元素的背景圖片
line-height:設置文字的行高
text-align:設置文字對其的方式
border-width:邊框的寬度
border-style:邊框的樣式
border-color:邊框的顏色
p:hover{color:blue}當鼠標移動到元素上時可以改變元素的css樣式
```