之前有整理過一部分知識點, 一直沒有發(fā)布, 因為都是有關 CSS 方面的零散內(nèi)容; 現(xiàn)在想想無論做什么都需要慢慢積累, 所以還是決定將之前整理的相關內(nèi)容驗證之后慢慢分享給你們, 現(xiàn)在看到感覺還挺有意思 暂刘。
好了廢話不多說, 直接上代碼以及圖例(為了讓大家方便閱讀, 都有自己驗證過程的一些圖片作為分享)锣披。
-
html空格符號代碼
1. :一個字符的半角的不斷行的空格娇钱,如果需要在網(wǎng)頁中插入多個空格他宛,可以將“ ”代碼寫多遍描馅;
2.   :一個字符的半角的空格颈墅,也可以將“ ”寫多遍來插入多個空格存哲;
3.   :兩個字符的全角的空格,也可以將“ ”寫多遍來插入更多的空格翩剪;
4.   :小于一個字符的空格乳怎;
-
代碼示例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> CSS/HTML 如何在網(wǎng)頁中添加空格(瑣碎知識點整理) </title>
</head>
<style>
.w_space-item {
background-color: skyblue;
height: 66px;
line-height: 66px;
font-size: 32px;
margin: 32px 0;
}
.w_space-pre {
white-space: pre;
}
</style>
<body>
<div>
<div>
<div class="w_space-shel">
<p class="w_space-item">空格-1: 示例</p>
<p class="w_space-item">空格-2:      示例</p>
<p class="w_space-item">空格-3:      示例</p>
<p class="w_space-item">空格-4:     示例</p>
<p class="w_space-item w_space-pre">空格: 示例</p>
</div>
</div>
</div>
</body>
</html>
-
圖片示例
-
總結
1. 大家有沒有想過為什么要使用html空格符號代碼呢, 直接在鍵盤上敲幾個空格不是更方便嗎?當你實際操作的
時候, 你會發(fā)現(xiàn) '默認情況下前弯,無論你在html源代碼中敲幾個空格蚪缀,在瀏覽器中運行都只顯示一個空格', 所以我們
就需要使用 html 空格符號代碼來實現(xiàn)網(wǎng)頁中多個空格的效果 。
2. 前面說的前提是 "默認情況下", 為什么說在默認情況下呢? 因為我們還可以使用 css 中的 "white-space" 屬性
來實現(xiàn)多個空格的效果; 就是將 "white-space" 屬性值設置為 "pre" 即: white-space: pre; 設置之后, 瀏覽器就會
保留 html 源代碼中的空格和換行; 這下你在源代碼中敲幾個空格, 瀏覽器中運行就會用幾個空格 恕出。
3. 在軟件開發(fā)中, 都是使用 html 空格符號 代碼來實現(xiàn)多個空格的效果 询枚。