塊級元素和行內(nèi)元素有哪些 在什么情況下用span標簽?和div的用法最大的區(qū)別是什么?
在什么情況下用span標簽?和div的用法最大的區(qū)別是什么?Div是塊級元素,span是串聯(lián)元素,Div、P、H1~H6和其他塊級元素。默認情況下,其他門后面的圖元將被推到底部以換行,而“跨度”的“內(nèi)
在什么情況下用span標簽?和div的用法最大的區(qū)別是什么?
Div是塊級元素,span是串聯(lián)元素,Div、P、H1~H6和其他塊級元素。默認情況下,其他門后面的圖元將被推到底部以換行,而“跨度”的“內(nèi)嵌”圖元將不換行,并且仍在一行中。如果你知道這一點,你可能知道什么時候用什么。示例:Code:
here to
結(jié)果:這里沒有換行符。另一個常見的例子是:highlight
假設(shè)P的樣式是顏色:藍色,文本中需要突出顯示的單詞“red”不是鏈接??梢蕴砑涌缇啵部梢韵蚩缇嗵砑訕邮筋伾杭t色還有一些特殊用法。你會逐漸理解以上兩種用法。
行內(nèi)元素,塊級元素,行內(nèi)塊級元素之間的區(qū)別是什么?如何轉(zhuǎn)換?
通過修改CSS屬性display屬性,可以將兩者相互轉(zhuǎn)換。設(shè)置顯示:行元素上的塊可以將其轉(zhuǎn)換為塊級元素。其實,本質(zhì)就是把它包起來。類似地,在塊級元素上設(shè)置display:inline允許將其轉(zhuǎn)換為inline元素。
下面的屏幕截圖是一個示例:
此代碼不會在標記&Lthr>前面設(shè)置轉(zhuǎn)換。默認情況下,<A>和<input>標記是內(nèi)嵌元素,<h1>標記是塊級元素。它們的顯示效果如下:
您可以看到,超鏈接和輸入框在水平線之前的同一行上,而一堆黑色的大字和水平線在下一行上。這是因為默認的<A>和<input>標記是行內(nèi)元素,而<h1>和&Lthr>標記是塊級元素。在圖中的水平線下,您可以找到一行超鏈接,因為我將其設(shè)置為塊級元素,而大黑色字符和輸入框位于同一行,因為我將大黑色字符<h1>標簽設(shè)置為內(nèi)嵌元素。請參見第一個圖中的代碼。
寫在這里,我相信你應(yīng)該了解行元素和塊級元素。
列舉至少五個常用的行內(nèi)標簽和區(qū)塊標簽,以及行內(nèi)元素和區(qū)塊元素的區(qū)別?
塊級元素占用一行,不管內(nèi)容有多少;
當(dāng)行中元素很少時,就不會換行。這是一個重要的區(qū)別。
塊元素
div-最常用的塊元素
DL-塊元素與DT DD一起使用
窗體-交互窗體
H1-標題
HR-水平分隔符
ol-排序窗體
P-段落
ul-非排序列表
內(nèi)聯(lián)元素
a-錨定
B-粗體(非)
Br-換行
em-emphasis
字體-字體設(shè)置(非)
I-斜體
img-圖像
輸入-輸入框
標簽-表格標簽
選擇-項目選擇
小字體-小字體文本
span-通用內(nèi)聯(lián)容器,定義文本塊
刪除-中劃線
強-粗體emphasis
子下標
sup上標textarea-多行文本輸入框
TT-teletext
u-下劃線
內(nèi)聯(lián)元素
span,IMG,a,label,code,input,abbr,EM,B,big,cite,I,Q,textarea,select,small,sub,sup,strong,u
塊級元素
div,P,h1-h6,form,UL,ol,DL,DT,DD,Li,table,TR,TD,th,HR,blockquote,address,table,menu,pre
在HTML標準文檔流中,a.Span標記屬于行內(nèi)元素,P和H標記屬于塊級元素,標記的內(nèi)容是以頁面鏈接的形式出現(xiàn)的,Span標記通常是純文本,P標記可以包含多個Span標記文本,H標記主要是文本(在SEO優(yōu)化中,H標記通常具有很高的權(quán)重)