Html中的空格

（半角的不斷行的空白格）

（半角的空格）

（全角的空格）

面小編為大家帶來的是解決網頁制作中的空格問題，這里詳細的介紹了解決網頁制作中的空格問題的相關知識，希望能對大家有所幫助。

Dreamweaver是一個非常簡單易用但又功能強大的網頁制作軟件。但是，它卻又一個令很多初學者很困惑的問題。那就是空格。在Dreamweaver中使用空格遠遠沒有象word中一樣方便。比如首行無法空格，句子中間空一格以上都是不行的。原因是什幺呢？這是因為在HTML語言中多于一個的空格都被忽略不計。這樣就造成了空格困難的原因。如何很好地解決Dreamweaver的空格問題呢？解決的方案有很多：1、制作一張很小的透明圖片。嵌入到文本當中或者行首。這種方法實現起來比較麻煩。2、使用全角空格。為什幺這種方案可行呢？因為全角空格實現起來比較簡單。雖然也是空格但是對應的HTML代碼卻不是空格代碼。而是另外的代碼，因此Dreamweaver把他當字符處理而不是空格。所以可以相安無事。但是在不支持中文字符集的瀏覽器看來就是亂碼了。3、使用軟空格。即在要插入空格的地方按Ctrl+shift+空格。這樣的空格所有瀏覽器都能認識。但是缺點是在頁面編輯的時候無法看見插入了多少空格，只能在瀏覽器預覽的時候才能看清楚。不夠直觀。軟空格其實使用的是代碼。是不間斷空距標記。他可以生成軟空格。每按一下Ctrl+shift+空格就是增加一個代碼。代碼雖然簡單，但是它的作用也很大。在做網頁時候我們空出一行或者幾行就要靠這個代碼來幫忙。學過HTML語言的朋友都知;;標簽是用來標記一個段落的。如果光寫;;這段代碼是不是就可以生成空行呢？這是無效的。必須在;標簽中增加“；”代碼才行。; ;這樣的代碼才會有空行效果。這里該標記也是起了占據位置的作用。另外如果用Dreamweaver生成一張表格，察看源代碼的時候會發現。

擊右上方紅色按鈕關注“小鄭搞碼事”，每天都能學到知識，搞懂一個問題！

由于HTML代碼的空格通常會被瀏覽器忽略，所以我們很有必要對瀏覽器處理空格的一些規則有個詳細的認識，這樣我們后面才能詳述它的解決辦法。

一、默認規則

效果是這樣的：

由此可此可以知道瀏覽器的默認處理規則一：文字的前后空格都會忽略，內部連續空格只有自作一個。

原樣輸出可能是我們這樣寫代碼的本意，要讓這段代碼原樣輸出的方法有兩個（使用標簽/使用表示空格的實體代碼）：

方法一：<pre> 小鄭搞碼 </pre>

方法二： 小鄭搞碼

二、另一個規則

關于規則部分還有一點，來看一段代碼：

效果是：

表示，瀏覽器對字符的處理不僅限于空格，還有制表符（\t），換行符（\r和\n）。

同樣讓這段代碼換行可能是我們寫的本意，讓這段代碼換行的方法有兩個：

方法一：套一個pre標簽

方法二：小鄭 搞碼

最后總結一下：

HTML語言的空格處理，基本上就是直接過濾。這樣的處理過于粗糙，完全忽視了原始文本內部的空格可能是有意義的。所以CSS提供了一個屬性white-space屬性來靈活控制空格。下篇詳述。

在線咨詢

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。