先說一下塊級元素和行內元素之間的區別：
先說一下塊級元素:div,form,h1,h2,h3,h4,h5,h6,ol,ul,p,dir,table,menu
塊級元素的特點：1：獨佔一行，其寬度會自動填滿父元素的寬度；
2：可以設定width，height，塊級元素就算是設定了width,height,也是獨佔一行；3：可以設定padding和margin，padding包括：top，bottom，left，right，margin包括：top，bottom，left，right；padding設定的是元素和塊級元素邊框之間的距離，margin設定的是外邊距；
@:：以div為例：
**為：
行內元素：span，strong，en，br，img，input，lable，textarea
行內元素的特點：1：不會獨佔一行，相鄰的行內元素會顯示在同一行，在排不下的情況下才會換行:2：對行內元素設定width無效；3：行內元素設定padding-left,padding-right,margin-left,margin-right會產生相應邊距，但是，但是，但是（重要的事情說三遍），padding-top，padding-bottom，margin-top，margin-bottom不會產生效果，即水平方向有效，垂直方向無效；
這裡舉乙個span和input的例子：
奇怪的事情粗線了。。。input是乙個行內元素，為什麼可以設定width和height呢？而span的width和height則沒有起作用，這是因為input是一替換元素，替換元素的定義就是：瀏覽器會根據元素的標籤和屬性來決定元素的顯示內容。替換元素有內在尺寸，所以width和height是可以設定的，常用的替換元素有input，img，textarea等，而span不是替換元素，所以不能設定高和寬，並且margin-top也沒有起作用。
在這裡給第乙個input設定margin-top，跟它相鄰的元素也會跟它顯示在同一行，並且input2的margin-top也沒有起作用，這正是行內元素的特點，不會獨佔一行，相鄰的元素會顯示在同一行。
CSS學習知識整理（一）Css 布局
overflow屬性有以下值 值描述 visible 預設值。內容不會被修剪，會呈現在元素框之外。hidden 內容會被修剪，並且其餘內容是不可見的。scroll 內容會被修剪，但是瀏覽器會顯示滾動條以便檢視其餘的內容。auto 如果內容被修剪，則瀏覽器會顯示滾動條以便檢視其餘的內容。inherit...
CSS內容學習整理
css是層疊樣式表，英文全稱 cascading style sheets css樣式分為 內部樣式 外部樣式 行內樣式 渡課官網 p 渡課官網 p2 p2 渡課官網 color 單詞 十六進製制 rgb x,x,x 文字樣式 注意點 text decoration 文字的下劃線 none 無 un...
關於一些CSS動態效果的整理
僅列出一些常用命令，和常用簡寫 過渡半秒 transition 5s 放大縮小 transform scale 1 移動效果 translatex 100 translatey 100 translate x,y 旋轉效果 rotate 45deg 關聯到動畫 test keyframes dong...