HTML

什麼是瀏覽器什麼是伺服器？

瀏覽器是指可以顯示網頁伺服器或檔案系統的HTML檔案（標準通用標記語言的一個應用）內容，並讓使用者與這些檔案互動的一種軟體。（前端） *特點：
- 可以顯示伺服器中的html檔案。
- 可以讓使用者與這些檔案互動。
伺服器，也稱為伺服器，是提供運算服務的設備。由於伺服器需要回應服務請求，並進行處理，因此一般來說伺服器應具備承擔服務並且保障服務的能力。
- 特點：
- 處理請求。
- 必須保證二十四小時開機狀態。

請求協定：http協定：

請求報文。
響應報文。
url:(網址)網址列上我們輸入的內容。
- Url的組成：協定：//伺服器的ip位址：連接埠號碼/請求頁面。

原來瀏覽器所做的事情是將伺服器回應回來的response進行從上到下的解析（渲染），將最後的頁面效果顯示出來。

瀏覽器上能辨識的語言

HTML:從語意角度，描述頁的結構。
css:從美學的角度，美化頁面。
javascript:從互動的角度，提升使用者的角度。

HTML

標籤與標籤的關係
- 嵌套關係
- 並列關係
標籤

2.1 h（header）標籤

<code><code class="hljs stylus"> h系列的标签(Header)：<span class="hljs-tag">h1,<span class="hljs-tag">h2,<span class="hljs-tag">h3,<span class="hljs-tag">h4,<span class="hljs-tag">h5,<span class="hljs-tag">h6
 作用：把页面上的文字加上标题上的语义
 *注意：一个页面只能使用一个h1标签</span></span></span></span></span></span></code>
</code>

登入後複製

2.2 p（paragraph）段落標籤

<code><code class="hljs undefined"> 作用：给页面的上一段文字加上段落的语义。
 特点：页面上的一个段落，单独占一行，并且与上下内容之间存在距离。</code>
</code>

登入後複製

2.3 hr標籤（Horizontal Rule）

<code><code class="hljs undefined"> 作用：在页面显示一条横线（没有自己的语义）
 特点： 在页面显示一条横线，默认占整行。</code>
</code>

登入後複製

2.4 br標籤（break）

<code><code class="hljs undefined"> 作用和特点都是换行</code>
</code>

登入後複製

2.5 b(Bold),u(Underlined),i(Italic),s(Strikethrough),strong,em,del,ins

<code><code class="hljs stylus"> 作用：
     b：加粗    语义：没有语义
     u: 下划线
     <span class="hljs-tag">i:  倾斜
     s: 删除线
     建议不要使用，因为这些标签没有语义。
     作用：
     <span class="hljs-tag">strong:加粗   语义：加强语气
     <span class="hljs-tag">ins:下划线
     <span class="hljs-tag">em:倾斜
     <span class="hljs-tag">del:删除线
     可以使用</span></span></span></span></span></code>
</code>

登入後複製

2.6 img標籤（image）:

<code><code class="hljs dos">       作用：在页面显示一张图片
       特点：就是显示图片。
        属性：
     src    图片显示的路径
     alt    如果图片加载不出来会显示这个属性中的文字
     <span class="hljs-built_in">title    介绍这张图片</span></code>
</code>

登入後複製

2.7 a標籤（Anchor）:錨

<code><code class="hljs livecodeserver"> <span class="hljs-operator">a 标签的其它名称：
    超级链接，超链接，锚链接
    作用：可以在一个页面跳转到另一个页面上
 注意：在<span class="hljs-operator">a标签之内必须要写上文字，如果没有，那么这个标签在页面上找不到。
 <span class="hljs-operator">a标签的其它用法：
 <span class="hljs-number">1.0可以不跳转（跳转到当前页面）href=”<span class="hljs-comment">#”
 <span class="hljs-number">2.0可以跳转到另外的页面。
 <span class="hljs-number">3.0可以在当前页面进行定位。
 A.设置<span class="hljs-operator">a标签的href属性为“<span class="hljs-comment">#id名”，
 B.在页面的指定位置加入一个目标标签（可以是任意标签）
 C.必须给这个标签设置一个id名：<p id=&rdquo;mubiao&rdquo;>这是目标</p>
  <span class="hljs-number">4.0在跳转的页面进行定位。
  <span class="hljs-number">5.0可以进行下载。（强烈不推荐使用）

    <span class="hljs-operator">a标签的属性：
  href    <span class="hljs-operator">a标签跳转的目标地址
  target    <span class="hljs-title">_blank:保留原始页面，再进行跳转
  <span class="hljs-title">_self:在当前页面进行跳转
  base    为页面上所有的<span class="hljs-operator">a标签设置跳转的方式（base标签一般放在titile标签下面）</span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></code></code>

登入後複製