首頁
外貿B2C模板開發
zencart 開發
Magento開發
經典客戶案例
zencart 報價
外貿主機
聯系我們
 
 
首頁 ::  zencart知識 ::  Zen Cart常見問題 ::  html塊級元素和內聯元素區別詳解
 
html塊級元素和內聯元素區別詳解

  作者: zen cart   |   2015-06-16     閱讀次數:1413     關鍵字:江蘇zencart服裝網店

html塊級元素和內聯元素區別詳解


塊級元素(block)特性:

  • 總是獨占一行,表現為另起一行開始,而且其后的元素也必須另起一行顯示;
  • 寬度(width)、高度(height)、內邊距(padding)和外邊距(margin)都可控制;
內聯元素(inline)特性:
  • 和相鄰的內聯元素在同一行;
  • 寬度(width)、高度(height)、內邊距的top/bottom(padding-top/padding-bottom)和外邊距的top/bottom(margin-top/margin-bottom)都不可改變,就是里面文字或圖片的大小;
塊級元素主要有:
  •  address , blockquote , center , dir , div , dl , fieldset , form , h1 , h2 , h3 , h4 , h5 , h6 , hr , isindex , menu , noframes , noscript , ol , p , pre , table , ul , li
內聯元素主要有:
  • a , abbr , acronym , b , bdo , big , br , cite , code , dfn , em , font , i , img , input , kbd , label , q , s , samp , select , small , span , strike , strong , sub , sup ,
         textarea , tt , u , var

可變元素(根據上下文關系確定該元素是塊元素還是內聯元素):
  • applet ,button ,del ,iframe , ins ,map ,object , script
CSS中塊級、內聯元素的應用:
 
       利用CSS我們可以擺脫上面表格里HTML標簽歸類的限制,自由地在不同標簽/元素上應用我們需要的屬性。
       主要用的CSS樣式有以下三個:
  • display:block  -- 顯示為塊級元素
  • display:inline  -- 顯示為內聯元素
  • dipslay:inline-block -- 顯示為內聯塊元素,表現為同行顯示并可修改寬高內外邊距等屬性
        我們常將<ul>元素加上display:inline-block樣式,原本垂直的列表就可以水平顯示了。

題外話:最近整理有關塊級元素和內聯元素區別的有關知識,網上找了不少相關的文章,發現大家的理解似乎都有誤,我自己親自測試了下,發現了不少的問題:
  1. 內聯元素的margin-left / margin-right及padding-left / padding-rigtht是可以控制的,所以可以通過這4個屬性來控制內聯元素的寬度。
  2. 內聯元素的內部也可以放塊級元素標簽,而且內部的塊級元素標簽會撐大外部的內聯標簽,所以可以通過放塊元素來控制內聯元素的高度(網上介紹的是內聯元素只能放文本及其他內聯元素)
             例如: <a> 
                              <div style="width:100px;height:100px;">測試</div>
                          </a>

附錄:col, colgroup, frameset, html, style, table, tbody, tfoot, thead, title, tr, td 等幾個元素標簽是只讀的,也就是不能使用innerHTML等進行動態賦值.







Zen Cart常見問題的相關新聞


更早的新聞

 
 
 
外貿網站模板  |  關于我們  |  核心技術  |  人才招聘  |  幫助中心  |  zencart下載  |  付款方式  |  公司地圖  |  聯系我們


粵ICP備15004589號
深圳市迅捷網絡技術有限公司 Copyright ? 2004-2016 All Rights Reserved. 版權所有
總公司:深圳市龍華新區民治街道人民路中航天逸大廈A3棟15層     網址:www.3269056.live  電話:0755-28107785
分公司:惠州市惠城區港惠新天地商業大廈2B棟19層 網址:www.0752web.com 電話:0752-2695554  2065565
全國服務熱線:137 14307967   售后服務熱線:159 19478387 客服QQ: 1512144 408079953 MSN:[email protected]
21点棋牌 微信股票群二维码大全 山西体育彩票11选五 中新药业股票 澳门棋牌娱乐网站视 大类资产配置岗位 网络棋牌多少钱? pk10软件 浙江6 1开奖结果走势图 四肖八码期期选一肖 单机四川麻将血战免