彙編初上手 - 棧幀學習筆記
tcp是面向連線的協議
tcp傳輸控制協議，用來保證所有的資料按順序接收。
如果不使用tcp，資料可能會丟失或亂碼。
tcp通過三次握手實現連線
udp是無連線的傳輸控制協議
通訊之前無需建立邏輯連線。也不保證資料傳輸的可靠性。
傳輸資料時並不關心資料有沒有被接收。
也被稱為即發即忘協議。
udp傳輸比tcp快。
埠號用來區分不同的網路服務。
瀏覽器可以分為shell和核心兩部分 shell是指瀏覽器的外殼，比如選單，工具欄，主要給使用者提供使用者介面操作，引數設定，它是呼叫核心來實現各種功能的。 核心才是瀏覽器的核心，核心時基於基本標記語言顯示內容的程式和模組，主流的瀏覽器有ie 火狐 谷歌 。 瀏覽器的核心又可以分為兩部分：渲染引擎和js引擎。它負責取得網頁內容，整理訊息，以及計算網頁的顯示方式，然後會輸出至顯示器或印表機。 元素水平居中的方法僅居中元素定寬高適用
absolute + 負margin
絕對定位的百分比是相對於父元素的寬高，通過這個特性可以讓子元素的居中顯示，但絕對定位是基於子元素的左上角，期望的效果是子元素的中心居中顯示
為了修正這個問題，可以藉助外邊距的負值，負的外邊距可以讓元素向相反方向定位，通過指定子元素的外邊距為子元素寬度一半的負值，就可以讓子元素居中
absolute + margin auto
這種方式通過設定各個方向的距離都是0，此時再講margin設為auto，就可以在各個方向上居中了
absolute + calc
這種方式也要求居中元素的寬高必須固定，top的百分比是基於元素的左上角，那麼在減去寬度的一半就好了
居中元素不定寬高
absolute + transform
絕對定位，這個方法不需要子元素固定寬高
lineheight
把元素設定為行內元素，通過text-align就可以做到水平居中
簡述盒模型
有兩種盒子，一種是w3c標準盒子模型和ie盒模型。
w3c包括內容的寬度，高度，padding，barter，margin。
盒子的可視寬度為：width，padding,margin。
ie盒模型包括內容padding，barter，margin。
盒子的可視寬度為width。
盒子的內容寬度為width，barter，padding。
css3通過box-sinzing指定和模式
box-sizing:content-box; =w3c標準盒模型
box-sizing：border -box; =ie盒模型
對HTML語義化的理解： 1，用正確的的標籤做正確的事。 2，html語義化讓內容結構化，內容更清晰。 使閱讀原始碼的人對網站更容易將網站分塊，便於閱讀，維護，理解。塊元素
常見的塊元素有<h1>-<h6>，<p>，<div>，<ul>，<ol>，<li>等，其中<div>標籤是最典型的塊元素。
塊級元素的特點：
比較霸道，自己獨佔一行。
高度，寬度，外邊距以及內邊距離都可以控制。
寬度預設是容器，(父級寬度)的100%。
是一個容器及盒子，裡面可以放行內或塊元素。
注意：
文字類的元素內不能使用塊級元素。
<p>標籤主要用於存放文字，因此<p>裡面不能放塊級元素，特別是不能放<div>。
同理，<h1>-<h6>等都是文字類塊級標籤，裡面也不用放其他塊級元素。
行內元素
常見的行內元素有<a>，<strong>，<b>等，其中<span>是最典型的行內元素。行內元素也叫內聯元素。
行內元素的特點：
相鄰行內元素在一行上，一行可以顯示多個。
高，寬直接設定是無效的。
預設寬度就是它本身內容的寬度。
行內元素只能容納文字或其他行內元素。
注意：
連結裡面不能再放連結
特殊情況連結<a>裡面可以放塊級元素，但是給轉換洗衣機塊級模式最安全。
行內塊元素
行內塊元素中有幾個特殊的標籤——<img/>，<input/>，<td>，它們同時具有塊元素和行內元素的特點。被稱為行內塊元素。
行內塊元素的特點：
和相鄰行內元素(行內塊)在一行上，但是他們之間有空白間隙，一行可以顯示多個(行內元素特點)。
預設寬度就是他們本身內容的寬度(行內元素的特點)。
寬度，行高，外邊距以及內邊距都可以控制(塊級元素的特點)。
元素顯示模式轉換
特殊情況下，我們需要元素模式的轉換，簡單理解，一個模式的元素需要另外一種模式的特性。
比如想要增加連結<a>的觸發範圍。
轉換為塊元素：diaplay:black;
轉換為行內元素：display :inline;
轉換為行內塊：display:inline-block;
js資料型別
基本 undefind,null,布林型，字串，數字型。
物件型別：物件，函式，陣列。
瀏覽器的渲染過程
html程式碼轉化成dom結構
css程式碼轉化成cssom的一個物件
結合dom和cssom生成一棵渲染樹，包含每一個節點的視覺資訊
然後生成一個佈局，將渲染樹的所有節點進行平面合成
最後將佈局繪製在螢幕上
清楚浮動的方法
額外標籤法，在浮動元素末尾新增一個空的標籤
父級新增overflow屬性，將其屬性設定為hideen,auto,scroll
父級新增affter元素
父級新增雙偽元素
優先順序
當同一個元素指定多個選擇器，就會有優先順序的產生。
選擇器相同，則執行層疊性。
選擇器不同，則根據選擇器權重執
<html>…</html>定義HTML文件
<head>…</head>文件的資訊
<meta>HTML文件的元資訊
<title>…</title>文件的標題
<link>文件與外部資源的關係
<style>…</style>文件的樣式資訊
<body>…</body>可見的頁面內容
<!--…-->註釋
文字
<h1>...</h1>標題字大小（h1~h6）
<b>...</b>粗體字
<strong>...</strong>粗體字(強調)
<i>...</i>斜體字
<em>...</em>斜體字(強調)
<center>…</center>居中文字
<ul>…</ul>無序列表
<ol>…</ol>有序列表
<li>…</li>列表專案
<ahref=”…”>…</a>超連結
<font>定義文字字型尺寸、顏色、大小
<sub>下標
<sup>上標
<br>換行
<p>段落
圖形
<imgsrc=’”…”>定義影象
<hr>水平線
表格
<table>…</table>定義表格
<th>…</th>定義表格中的表頭單元格
<tr>…</tr>定義表格中的行
<td>…</td>定義表格中的單元
其它
<form>…</form>定義供使用者輸入的HTML表單
<frame>定義框架集的視窗或框架
一 CSS文字屬性
color : #999999; /*文字顏色*/
font-family : 宋體,sans-serif; /*文字字型*/
font-size : 9pt; /*文字大小*/
font-style:itelic; /*文字斜體*/
font-variant:small-caps; /*小字型*/
letter-spacing : 1pt; /*字間距離*/
line-height : 200%; /*設定行高*/
font-weight:bold; /*文字粗體*/
vertical-align:sub; /*下標字*/
vertical-align:super; /*上標字*/
text-decoration:line-through; /*加刪除線*/
text-decoration: overline; /*加頂線*/
text-decoration:underline; /*加下劃線*/
text-decoration:none; /*無修飾線*/
text-transform : capitalize; /*首字大寫*/
text-transform : uppercase; /*英文大寫*/
text-transform : lowercase; /*英文小寫*/
text-align:right; /*文字右對齊*/
text-align:left; /*文字左對齊*/
text-align:center; /*內部元素居中*/
text-align:justify; /*文字分散對齊*/
vertical-align:top; /*垂直對齊該行元素內的最大元素頂部/
vertical-align:bottom; /*垂直對齊該行元素內的最大元素的底部*/
vertical-align:middle; /*垂直居中對齊*/
vertical-align:text-top; /*垂直對齊父元素的頂部*/
vertical-align:text-bottom; /*垂直對齊父元素的底部*/
top、bottom、text-top、text-bottom區別：
overflow:hidden;//隱藏文字溢位部分。
white-space:nowrap;//對文字不換行。
text-overflow:ellipsis;//溢位部分用省略表示(基於前兩個屬性都有的情況下)
text-overflow:clip;//剪下。
text-overflow:".....";//自定義格式。
position:absolute;//設定文件的位置為絕對定位，relative表示相對定位。
right:50px;//表示該元素距離右邊元素的距離為50px，使用該元素必需設定position元素。
z-index；/*指定元素的堆疊順序*/
clip：rect(top,right,bottom,left);/*剪下圖形*/
flex//flex佈局,在使用flex佈局的時候，需要將父容器的flex的display設定為“display:flex;”。
title:"提示資訊“ title元素用在指定的元素上，會出現提示資訊。
二、CSS邊框空白
padding-top:10px; /*上邊框留空白*/
padding-right:10px; /*右邊框留空白*/
padding-bottom:10px; /*下邊框留空白*/
padding-left:10px; /*左邊框留空白