1. 程式人生 > >HTML中內聯元素和塊級元素的區別

HTML中內聯元素和塊級元素的區別

最主要的區別是:
內聯不佔行,如input,span,a,你會發現寫多個input的時候,它們都排在同一行
塊狀元素,佔行,如div,p。你會發現寫多個div的時候,它們都各自佔一行。
有時候你用到什麼元素的時候,可能自己觀察下。也可以去看下w3school
如果你想內聯元素佔行,可以用css中的display:block;

內聯元素和塊級元素的相互轉換

直接轉換即可,如下 :
  <div style="display:inline">塊變內聯 </div><span style="display:block">內聯變塊</span>

  內聯元素(inline element)一般都是基於語義級(semantic)的基本元素。內聯元素只能容納文字或者其他內聯元素,常見內聯元素"a"。
  塊元素(block element)和內聯元素(inline element)都是html規範中的概念。塊元素和內聯元素的基本差異是塊元素一般都從新行開始。而當加入了css控制以後,塊元素和內聯元素的這種屬性差異就不成為差異了。

相關推薦

HTML元素元素區別

最主要的區別是:內聯不佔行,如input,span,a,你會發現寫多個input的時候,它們都排在同一行塊狀元素,佔行,如div,p。你會發現寫多個div的時候,它們都各自佔一行。有時候你用到什麼元素的時候,可能自己觀察下。也可以去看下w3school。如果你想內聯元素佔行,

html元素元素區別(超級詳細)

1.下表列出了內聯元素和塊級元素的主要區別 html中內聯元素和塊級元素的區別 塊級元素 行內元素 獨佔一行,預設情況下,其寬度自動填滿其父元素寬度 相鄰的行內元素會排列在同一行裡,直到一行排不下,才會換行,其寬度隨元素的內容而變化 可以設定wid

html的行元素元素有哪些。

rom html ext mea ble put select 換行 sel 在html中,元素主要分為行內元素和塊級元素; 行內元素指的是書寫完成後不會自動換行,並且元素沒有寬和高。 塊級元素寫完後會自動換行,有寬高可以修改。 還有一種特殊的元素叫做行內塊元素。 大致分內

Html元素元素

dir 換行 需要 com 區塊 iframe 自己 span clas 1.關於行內元素和塊狀元素的說明 根據CSS規範的規定,每一個網頁元素都有一個display屬性,用於確定該元素的類型,每一個元素都有默認的display屬性值,比如div元素,它的默認

詳解css的display屬性(行元素元素

display屬性 首先,所有主流瀏覽器都支援 display 屬性。其次,我們都知道display 屬性規定元素應該生成的框的型別。預設值:inline 我們常用的display屬性值有: inline block inline-block none 把 display

Html中行元素元素有哪些?

  3.行內、塊狀元素: 塊元素(block element)   * address - 地址   * blockquote - 塊引用   * center - 舉中對齊塊   * dir - 目錄列表   * div - 常用塊級容易,也是css layout的主要標籤   * dl - 定義列表   

元素元素(行)元素不能設定margin-top

內聯(行級)元素 不能設定寬高,但padding屬性可以設定,需要注意的是行級元素不能設定margin-top和margin-bottom屬性,但可以設定margin-left和margin-right屬性。如果需要設定行級元素的margin-top或margin-botto

元素元素

inline line 表格 object 文本 格式 但是 for border 1 塊級元素:div , p , form, ul, li , ol, dl, form, address, fieldset, hr, menu, table

元素元素水平及垂直居中

常用 大小 form splay 平分 字體大小 分隔 特點 很好 首先,介紹一下行內元素和塊級元素,這個很重要,因為有的屬性只能用於塊元素,而有的正好相反,在一定的情況下,它們也可以相互轉換,比如用display來進行設置。 行內元素: ①不占據一整行,隨內容而定,有以

微信小程序布局之行元素元素

外邊距 邊距 gin add 屬性 微信 如果 改變 盒子模型 元素按照顯示方式主要可以分為塊級元素和行內元素,元素的顯示方式由display屬性控制。 塊級元素特點總結: 1、總是在新行上開始 2、寬度的默認為width+margin-left+margin-right+

html入門 如何 區別元素 元素

src gin type head 一行 utf-8 p s html asd <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>

CSS學習——行元素元素的轉換

行內元素 span、i、 a、 img等等。 在一行內顯示,一般情況不可以設定寬高的元素就是行內元素。 塊級元素 div、h1、p、li等等。獨佔一行,可以設定寬高的元素就是塊級元素。 行內元素轉換成塊級元素 在行內元素中設定display:block;就可以讓行內元

元素元素

塊級元素:一般用來搭建網站架構、佈局、承載內容 內嵌元素:用以“強調、區分樣式、上標、下標、錨點”等等 inline-block:既具有 block 元素可以設定寬高的特性,同時又具有 inline 元素預設不換行的特性,也可以設定 vertical-align 塊級元素與內嵌元素的區別

CSS設定行元素元素的水平居中、垂直居中

CSS設定行內元素和塊級元素的水平居中、垂直居中 首先,介紹一下行內元素和塊級元素,這個很重要,因為有的屬性只能用於塊元素,而有的正好相反,在一定的情況下,它們也可以相互轉換,比如用display來進行設定。 行內元素: ①不佔據一整行,隨內容而定,有以下特點: ②不可以設定

元素元素水平及垂直居中問題

首先,介紹一下行內元素和塊級元素,這個很重要,因為有的屬性只能用於塊元素,而有的正好相反,在一定的情況下,它們也可以相互轉換,比如用display來進行設定。 行內元素: ①不佔據一整行,隨內容而定,有以下特點: ②不可以設定寬高,也不可以設定行高,其寬度隨著內容增加,高度隨字型大小而改

元素元素區別,為何img、input等行元素可以設定寬高??(夯實基礎)

<spanstyle="display: inline-block;width:400px;height:60px;border:1px solid blue;">當使用display:inline-block;後,行內元素可以設定寬高</span> (ads

元素元素的具體區別是什麼?inline-block是什麼?(面試題目)

原文地址: https://www.cnblogs.com/iceflorence/p/6626187.html?utm_source=itdadao&utm_medium=referral 一,行內元素與塊級元素的區別: 1.行內元素與塊級元素直觀上的區別二、行內

簡要描述行元素元素區別

塊級元素的前後都會自動換行,如同存在換行符一樣。預設情況下,塊級元素會獨佔一行。例如,<p>、<hn>、<div>都是塊級元素。在顯示這些元素中間的文字時,都將從新行

行類元素元素區別,並舉例

big textarea 沒有 自己的 標簽 inpu bsp nav tar 行類元素 em i span a big stong b input textarea 1.不會獨占一行 2.排列方式為從左到右 3.設置高寬沒有作用 4.不設置高寬是其本身的高寬 5.行內元素

關於HTML(含HTML5)的元素元素總結

1.首先我們要知道什麼是塊級元素和行級(內聯)元素?    塊級(block)元素的特點:  ①總是在新行上開始;    ②高度,行高以及外邊距和內邊距都可控制;    ③寬度預設是它的容器的100%,除非設定一個寬度;    ④它可以容納內聯元素和其他塊元素。