任務1

軟體開發

前端：html、css、javascript、vue
后端：java、python、php、c++

任務2

HTML(解釋性語言)

HTML的發展史
- html4
- html5
運行環境(瀏覽器、現代瀏覽器)
- Googel Chrome
- Mozilla Firefox
- Microsoft Edge
開發工具
- VScode
- Hbuilder
- 等等
注釋
- 從上到下一行一行渲染解釋執行，
- 能在瀏覽器中查看源代碼和審查元素，
- 標簽一般是成對出現的，也有自封閉標簽，

任務3

HTML的基礎結構

基本結構
```
<html>
    <head>
       <title>網頁標題</title>
    </head>
    <body>網頁內容</body>
</html>
```
- 掌握<!DOCTYPE>的作用與意義
  
  它宣告了這是html5的檔案規范，加上了<!DOCTYPE html>之后會讓瀏覽器強制使用w3c標準來決議和渲染頁面，如果不加上這一行的話，瀏覽器就會按照自己的標準進行決議和渲染，可能會導致頁面的元素或布局出現問題，
- 掌握<html></html>、<head></head>、<body></body>之間的關系，
- 掌握<meat>(在<head>與</head>之間，并且使用 meta 設定編碼要先于 title 標簽)
  - 使用 charset 屬性設定頁碼編碼
```
<meta charset="utf-8" />
```
  - 能夠使用keyword 屬性設定搜索關鍵字 (搜索引擎)
```
<meta name="keywords" content="購物，買衣服，買球鞋，買啊買賣" />
```
  - 能夠使用description 屬性設定頁面描述資訊 (搜索引擎)
```
<meat name="description" content="買東西的地方，我要東西，購買新的家具" />
```
  - 能夠使用 http-equiv 屬性和content 屬性設定頁面自動重繪和跳轉
```
<meta http-equiv="refresh" content="3;url=https://www.baidu.com" />
```
  - 能夠使用 <link> 設定瀏覽器標題欄小圖示
```
<link href="img/logo.png" rel="icon" />
```
  - 能夠為HTML代碼添加注釋
```

```
注釋
- 在Hbuilder中快捷注釋的方法為"Ctri+/"，
- 被注釋掉的部分不會被解釋執行，但依舊會發到瀏覽器上面，
- “utf-8'被成為萬國碼，他支持很多國家的各種語言，
- <link>加載本網頁之外的內容，

任務四

塊標簽

標題標簽(從大到小)
```
<h1>標題1</h1>
<h2>標題2</h2>
```
段落標簽
- 段落標簽中不能插入 div 標簽，否則會將一個<p></p> 拆分成兩個段落
- 知道段落前后有空白行(默認效果)
```
<p>西安的油潑面好吃</p>
<p>西安的油潑面好吃</p>
```
水平線標簽（寬度(width)、排列方式(align)、高度·(size)、陰影(noshade)）（是自封閉標簽）
```
<hr width="500" align="center" size="7" noshade="noshade"/>
```
有序串列（串列專案的風格(list-style)、可嵌套、學會看注釋、type可設定串列前計數模式）
```
<ol>
     <li>出生</li>
     <li>成長</li>
     <li>死亡</li>
</ol>
```

無序串列（串列專案的風格(list-style)、可嵌套，學會看注釋、type可設定串列前的點）

<ul type="square">
    <li>西安</li>
       <ol type="A">
        <li><span style="color:red;font: '微軟雅黑' ;font-size: 30px;">油面</span></li>
                <li>羊肉</li>
                <li>鐘樓</li>
       </ol>
    <li>蘭州</li>
    <li>北京</li>
</ul>

描述標簽（ dl為描述標簽、dt描述標簽的標題、dd描述標簽的詳細內容，用于產品介紹，合同條款、

標簽的題目內容都不僅僅局限與文字）
```
<dl>
    <dt><img src="img/home.png"></dt>
    <dd>描述標簽的詳細資訊</dd>
    <dd>描述標簽的詳細資訊</dd>
    
</dl>
```

div標簽

div標簽是個容器標簽，
div標簽里面可以放行標簽和塊標簽，而<p></p>只能放行標簽，
div表示頁面上的一個磁區，

div呈現的效果可以由css來設定，一些簡單的風格也可以由style來設定

<div style="width: 300px;height: 300px;background-color: red;">
        <p>
            西安油潑面
        </p>
        <p>
            西安油潑面
         </p>
         <ul>
            <li>西安油潑面</li>
            <li>西安油潑面</li>
        </ul>
 </div>

任務五

行標簽

span標簽（span標簽屬于容器標簽，只針對一行，用來修飾文本）
```
<span style="color: red;font-size: 40px;">油潑面</span>
```
換行標簽（源代碼中的回車換行在瀏覽器中不會換行、與段落標簽（有空白）效果的差別）
```
<br />
```

任務六

nginx服務器

進入nginx目錄下:
```
cd nginx-1.21.1
```
在命令提示符中啟動nginx:(啟動后可以在任務管理器中查看到兩個nginx行程)
```
start nginx
```
修改配置后重新加載生效
```
nginx -s reload
```
有序退出
```
nginx -s quit
```
快速關閉
```
nginx -s stop
```
結束所有行程(tasklist 、taskkill 、start 都是 Windows 自帶的命令，不是 nginx 提供的)
- 因為多次啟動 nginx 導致啟動了多個 nginx 行程，此時需要列出這些行程相關的資訊:
```
tasklist /fi "imagename eq nginx.exe"
```
- 如果需要將這些行程全部殺死，可以使用以下命令:
```
taskkill /f /f /im nginx.exe
```

轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/290618.html

標籤：其他

上一篇：Linux下nginx模塊之nginx_http_autoindex_module

下一篇：LNMP的基本搭建

學習HTML＜一＞

任務1

軟體開發

任務2

HTML(解釋性語言)

任務3

HTML的基礎結構

任務四

塊標簽

任務五

行標簽

任務六

nginx服務器