HTML行內塊元素的顯示出現空格的問題

2021-10-10 09:28:25 字數 647 閱讀 4852

html行內塊元素在網頁上出現空格

我們在寫html**的時候,有時候會用到行內塊元素,行內塊元素它的定義是,有寬高並且獨佔一行。:

例如:我們要用到許多行內塊元素,並寫成以下情況

"text"

>

"text"

>

"text"

>

"text"

>

"text"

>

當我在瀏覽器執行的時候,會發現每個input之間會乙個空格在他們中間,這樣的情況顯然我們不希望發生,

首先我們排除了input的預設margin,給它加上是沒有什麼效果的; 當我們在html**中輸入多個空格的時候,瀏覽器也只會給我們解析成為乙個空格,從這個方面去推論的話,我們會發現當我們換行的時候,瀏覽器也會給我們解析成乙個空格

當我們把input寫到一行的時候,這些問題可以從根本上解決問題,但是影響了**的美觀和閱讀效果

所以我們可以把行內塊轉換成塊級元素,這是工作中用到最多的一種方法

或者我們可以把行內塊元素進行浮動處理,也會解決上面出現空格的問題

HTML 行內元素 塊級元素 行內塊元素的特點

html標籤按照元素種類可以分為行內元素 display inline 塊級元素 display block 和行內塊級元素 display inline block 三種。了解元素種類有利於,我們進行css布局及屬性的使用。相鄰元素可以在一行顯示直到一行排不下才進行換行。不可設定寬高 對齊等屬性,...

HTML行內元素 塊級元素 行內塊級

html標籤按照元素種類可以分為行內元素 display inline 塊級元素 display block 和行內塊級元素 display inline block 三種。了解元素種類有利於,我們進行css布局及屬性的使用。也叫內聯元素或內嵌元素,只能容納文字或其他內聯元素。預設特點 示例 關關雎...

Html行內元素與塊元素

塊元素 block element 1 address 位址 2 blockquote 塊引用 3 center 舉中對齊塊 4 dir 目錄列表 5 div 常用塊級容易,也是css layout的主要標籤 6 dl 定義列表 7 fieldset form控制組 8 form 互動表單 9 h1...