在div中显示html_HTML基础知识之DIV
生活随笔
收集整理的這篇文章主要介紹了
在div中显示html_HTML基础知识之DIV
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
一、HTML 塊元素
- 大多數(shù) HTML 元素被定義為塊級(jí)元素或內(nèi)聯(lián)元素;
- 元素在瀏覽器顯示時(shí),通常會(huì)以新行來開始和結(jié)束;
- 如:<h1>,<p>,<ul>,<table>,<div>等標(biāo)簽;
二、HTML 內(nèi)聯(lián)元素
- 內(nèi)聯(lián)元素在顯示時(shí)通常不會(huì)以新行開始;
- 如:<b>, <td>, <a>, <img>,<span>等標(biāo)簽;
三、HTML <div> 元素
- HTML 中的<div> 元素是塊級(jí)元素,它是可用于組合其他 HTML 元素的容器;
- <div> 標(biāo)簽定義 HTML 文檔中的一個(gè)分隔區(qū)塊或者一個(gè)區(qū)域部分;
- <div> 元素經(jīng)常與 CSS 一起使用,用來布局網(wǎng)頁(yè);
四、div的使用
<!doctype html> <html> <head> <meta charset="utf-8"> <title>無標(biāo)題文檔</title></head> <style>.all{width:500px;height:500px;margin:0 auto;background-color:#000;}.one{height:100px;background-color:#89E1BF;}.two{height:100px;background-color:#DEE099;}.three{height:100px;background-color:#D7A1CE;}</style><body><!--父div--><div class="all"><!--子div--><div class="one"></div><!--子div--><div class="two"></div><!--子div--><div class="three"></div></div> </body> </html>演示效果如圖所示:
圖1總結(jié)
以上是生活随笔為你收集整理的在div中显示html_HTML基础知识之DIV的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 芋圆,毛峰茉莉,谷谷金砖,功夫红玉奶茶最
- 下一篇: 如何正确的处理废旧家居用品?