HTML代碼中的空格和空行

子1：（文本內容中的連續空格）

<p>這段文本中，輸入連續的空格          大概輸入了十個。</p>

顯示效果：“格”和“大” 之間的是個空格顯示出來只是一個空格。

這段文本中，輸入連續的空格 大概輸入了十個。

例子2：（代碼之間的連續空格）

<span>span是一個行內標簽</span>               <span>和前面的span元素之間隔了很多個空格</span>

顯示效果:兩個span元素之間連續的空格，顯示出來即"簽"與“和”之間的空格，只有一個空格。

span是一個行內標簽 和前面的span元素之間隔了很多個空格

上面兩個例子證明：HTML代碼中連續的空格在顯示時會顯示為一個空格，其余的多余的空格會被移除或者說被忽略。

段落文本其實也是HTML代碼的一部分，只不過它在p標簽內部，而例子2的空格是在兩個span標簽之間。

理解了空格，現在看看空行，同理

例子3：（文本內容中的空行）

<p>這段文本中，輸入連續的空行





大概輸入了五行。</p>

顯示效果：如我們所見，文本代碼中的五行空行，顯示出來也只是一個空格。

這段文本中，輸入連續的空行 大概輸入了五行。

例子4：（元素之間/標簽之間的空行），只要把例子2中的空格換成空行就可以了，顯示效果和例子2的一樣，多行空行都只會顯示為一個空格。

<span>span是一個行內標簽</span>





<span>和前面的span元素之間隔了很多空行</span>

span是一個行內標簽 和前面的span元素之間隔了很多空行

得證：HTML 代碼中的所有連續的空格或空行（換行）都會被顯示為一個空格。

既然如此，如果我們希望擴大兩個字符之間的間距，讓代碼中的連續空格或空行顯示出來的結果也是連續的空格或空行，那該怎么辦？其實很簡單。

方法一：我們可以用預格式化標簽<pre>，無論是空格或空行都適用。

<pre>
這是
預格式文本。
它保留了      空格
和換行。
</pre>

顯示效果

這是
預格式文本。
它保留了      空格
和換行。

方法二：我們可以用空格實體符代替空格，用換行標簽 代替空行。雖然這種方法可以得到我們想要的顯示效果，但是對搜索引擎不是最友好的方式，因為和 在HTML中都是沒有語義的。所以建議盡量少用。另外需要注意的是，必須小寫，而且最后面的分號是不能省略的。

方法三：（適合空格）使用全角空格

全角空格被解釋為漢字，所以不會被被解釋為HTML分隔符，可以按照實際的空格數顯示。

問題：怎么使用全角輸入法？

以搜狗輸入法為例，我們通常使用的是半角輸入，其狀態欄中有個月亮的標志，就說明正在使用的是半角輸入，如果是太陽的標志，就說明使用的是全角輸入。全角/半角的切換可以通過點擊標志，也可以通過快捷鍵 Shift+Space（空格符）切換。

半角輸入（月亮）

全角輸入（太陽）

方法四：使用CSS樣式中字間隔屬性控制，CSS中的word-spacing 屬性可以改變字（單詞）之間的標準間隔。我們知道英文中兩個單詞之間是通過空格隔開的，所以我們視覺上可以這樣認為，word-spacing改變了（拉長或縮短）單詞之間那個空格的寬度。

方法五：使用CSS樣式中的white-space 屬性，這個屬性聲明如何處理元素內的空白符。

值	描述
normal	默認。空白會被瀏覽器忽略。
pre	空白會被瀏覽器保留。其行為方式類似 HTML 中的 <pre> 標簽。
nowrap	文本不會換行，文本會在在同一行上繼續，直到遇到 <br> 標簽為止。
pre-wrap	保留空白符序列，但是正常地進行換行。
pre-line	合并空白符序列，但是保留換行符。

white-space:normal;就是正常，和不設置一樣，連續空格和空行都只會顯示一個空格。

white-space:nowrap;不換行是什么意思呢？正常情況下，當我們的文本超出了文本域，文本就會自動折行，這個設置就是說不自動折行了，而是碰到換行標簽 才換

white-space:pre;和方法一相同，將文本原樣輸出顯示。當文本超出文本域時，不換行，會產生滾動條。

white-space:pre-wrap;保留空格和空行，但當文本超出文本域時，會自動換行。

white-space:pre-line;連續的空格會顯示為一個空格，但保留連續的空行。

機關及其直屬機構2022年度

考試錄用公務員云南考區筆試重要提示

各位考生：

中央機關及其直屬機構2022年度考試錄用公務員筆試將于2021年11月27日、28日舉行。為進一步提升服務保障質量，確保考生順利參考，現將有關事項提示如下。

一、重點事項提示

（一）按要求打印準考證。請考生于2021年11月22日00:00—11月28日12:00自行下載打印準考證，打印準考證前須仔細閱讀《中央機關及其直屬機構2022年度考試錄用公務員云南考區筆試新冠肺炎疫情防控告知暨承諾書》，下載打印準考證即視為認同并簽署《中央機關及其直屬機構2022年度考試錄用公務員云南考區筆試新冠肺炎疫情防控告知暨承諾書》。準考證是考生參加筆試的必須憑證，務必妥善保管，請仔細閱讀并遵守所載內容。

（二）準確掌握考點名稱和地址。本次筆試，我省在昆明市、昭通市、曲靖市、玉溪市、楚雄州、紅河州、德宏州芒市和瑞麗市八個城市設置考點，請考生務必認清考點名稱、提早熟悉考點地址和交通路線，避免走錯考點、找錯考場、坐錯座位。考試當天，請合理安排出行，以免影響正常參考。

（三）按要求做好疫情防控。

1．考生須考前3天提前申領“云南健康碼”和“通信大數據行程卡”，并于本人首場考試考前48小時內進行新冠病毒核酸檢測。做好日體溫測量和健康狀況監測，持續關注健康碼狀態，有異常情況須及時報告考點所在州（市）人力資源社會保障部門。

2．考試當天，考生應至少提前1小時到達考點。考生進入考點前，應當主動出示本人“云南健康碼”“通信大數據行程卡”信息，出具本人首場考試考前48小時內有效核酸檢測陰性證明，按要求主動接受體溫測量。未出具核酸檢測陰性證明的，不得進入考點。

（1）“云南健康碼”為綠碼，“通信大數據行程卡”為綠碼且14日內未到過存在中高風險地區的城市（即行程卡綠碼中無*號標記），現場測量體溫正常（≤37.3℃），考前48小時內核酸檢測結果為陰性的考生，可進入考點參加筆試。體溫異常（>37.3℃）由駐點醫療專業防疫人員進行初步排查，可排除疑似新冠肺炎的，經詢問個人身體狀況，能堅持考試者，由工作人員引導至備用考場進行筆試。

（2）“云南健康碼”為黃碼，“通信大數據行程卡”顯示到過國內中風險地區的城市的考生，須提供筆試前3天內2次（每次間隔不低于24小時）有效的核酸檢測陰性證明，現場測量體溫正常（≤37.3℃）可進入普通考場參加考試，未提供證明的不得進入考點。體溫異常（>37.3℃）由駐點醫療專業防疫人員進行初步排查，可排除疑似新冠肺炎的，經詢問個人身體狀況，能堅持考試者，由工作人員引導至備用考場進行筆試。

（3）近期有過邊境縣（市、區）旅居史的考生，須提供筆試前7天內兩次（最近一次檢測應在首場考試前48小時內）有效的核酸檢測陰性證明。

（4）近一個月內有境外旅居史的考生，須提供14天有效的集中醫學隔離觀察證明和7天有效居家隔離觀察證明、考試前3天內2次（每次間隔不少于24小時）有效的核酸檢測陰性證明，現場測量體溫正常（≤37.3℃）可進入普通考場參加考試，未提供證明的不得進入考點。體溫異常（>37.3℃）由駐點醫療專業防疫人員進行初步排查，可排除疑似新冠肺炎的，經詢問個人身體狀況，能堅持考試者，由工作人員引導至備用考場進行筆試。

（5）“云南健康碼”為紅碼的考生不得進入考點。

（6）身體有其他異常情況的考生，需配合駐點醫療專業防疫人員做好健康風險研判。經復測復查確有發熱或呼吸道異常癥狀的考生，由駐點醫療專業防疫人員進行個案預判，對能排除疑似新冠肺炎且具備繼續考試條件的，轉移至備用考場考試，對不能排除的，一律由負壓救護車轉運至定點醫院就診排查。

3．考生自備一次性醫用口罩，赴考時如乘坐公共交通工具，需要全程佩戴口罩，可佩戴一次性手套，并做好手部衛生，同時注意保持安全社交距離。

4．考試期間，考生要自覺維護考試秩序，與其他考生保持安全社交距離，服從現場工作人員安排，考試結束后按規定有序離場。

5．考生如因有相關旅居史、密切接觸史等流行病學史被集中隔離，筆試當天無法到達考點的，視為主動放棄考試資格。

6．請考生注意個人防護，考生進入考點內，除核驗信息時須配合摘下口罩以外，考試全程應佩戴一次性醫用口罩。

7．如考試前出現新的疫情變化，將通過云南人力資源和社會保障網“人事考試專欄”（https://hrss.yn.gov.cn/ynrsksw/Index.html）及時發布補充公告，明確疫情防控要求，請廣大考生密切關注。

8．考生凡隱瞞或謊報旅居史、接觸史、健康狀況等疫情防控重點信息，不配合工作人員進行防疫檢測、詢問等的，取消考試資格，如有違法情況，將依法追究法律責任。

（四）帶齊證件。考生須帶齊準考證、本人有效身份證件原件（與報名時一致）和本人首場考試考前48小時內有效新冠病毒核酸檢測陰性證明方可參加考試。考試開始前60分鐘起接受安檢有序進入考場，對號入座，坐錯座位根據相關規定按違規違紀處理。兩證不全或不一致或未出具有效核酸檢測陰性證明者，不得進入考場。考試開始30分鐘后一律禁止入場，考試期間不得交卷、離場；離場后不得再次進入考場。

（五）嚴禁將禁止物品帶入考場。考生進入考場時，除規定文具、準考證、身份證外的其他物品須放置在考場門口柜子或桌子上（通訊設備、電子設備必須全部切斷電源），嚴禁將各類手表和各種電子、通信、計算、存儲或其它有關設備及與考試相關的資料等物品帶入考場。考生在座次表上簽到時，須填寫本人手機號碼。

（六）考生有責任和義務在監考人員拆封試卷前查驗密封情況并簽字確認。

（七）試卷和答題卡發放后，考生應立即檢查本人卷卡是否有裝訂印刷錯誤或污損，如有問題立即舉手向監考人員報告，否則后果自負。《行政職業能力測驗》科目答題卡印制在試卷封底內頁，開始答題前，考生請沿裁切線自行小心撕下。考生必須在配套答題卡上作答，卷卡不一將影響考試成績。

（八）《行政職業能力測驗》科目一律用2B鉛筆在答題卡上填涂作答，《申論》科目一律用黑色字跡的鋼筆、簽字筆作答。考生應自備橡皮、2B鉛筆、黑色字跡的鋼筆或簽字筆。為保障考試的公平公正性，考試期間，監考人員將對考生攜帶的文具進行檢查，請考生予以配合。

（九）遵守規則，誠信參考。考生須按準考證所載內容要求參加考試，嚴格遵守考場規則，自覺服從考試工作人員管理，接受監考人員的監督和檢查，誠信參考，避免出現違規違紀行為。考生出現違規違紀行為，將按《公務員錄用違規違紀行為處理辦法》有關規定處理，構成犯罪的，依法追究刑事責任。

二、法律法規提示

（一）《刑法修正案（九）》規定：“在法律規定的國家考試中，組織作弊的，處三年以下有期徒刑或者拘役，并處或者單處罰金；情節嚴重的，處三年以上七年以下有期徒刑，并處罰金”“為他人實施前款犯罪提供作弊器材或者其他幫助的，依照前款的規定處罰”“為實施考試作弊行為，向他人非法出售或者提供第一款規定的考試的試題、答案的，依照第一款的規定處罰”“代替他人或者讓他人代替自己參加第一款規定的考試的，處拘役或者管制，并處或者單處罰金”。

（二）《最高人民法院最高人民檢察院關于辦理組織考試作弊等刑事案件適用法律若干問題的解釋》明確“中央和地方公務員錄用考試”屬于“法律規定的國家考試”，考試作弊觸犯刑法，屬于犯罪。

三、公務員錄用違規違紀行為處理辦法摘錄

第六條報考者在考試過程中有下列行為之一的，由具體組織實施考試的考試機構、招錄機關或者公務員主管部門給予其所涉科目（場次）考試成績為零分的處理：

（一）將規定以外的物品帶入考場，經提醒仍未按要求放在指定位置的；

（二）參加考試時未按規定時間入場、離場的；

（三）未在指定座位參加考試，或者擅自離開座位、出入考場的；

（四）未按規定填寫（填涂）、錄入本人或者考試相關信息，以及在規定以外的位置標注本人信息或者其他特殊標記的；

（五）故意損壞本人試卷、答題卡（答題紙）等考場配發材料或者本人使用的考試機等設施設備的；

（六）在考試開始信號發出前答題的，或者在考試結束信號發出后繼續答題的；

（七）其他情節較輕的違規違紀行為。

第七條報考者在考試過程中有下列行為之一的，由設區的市級以上公務員主管部門給予其取消本次考試資格并五年內限制報考公務員的處理：

（一）抄襲他人答題信息或者協助他人抄襲答題信息的；

（二）查看、偷聽違規帶入考場與考試有關的文字、視聽資料的；

（三）使用禁止攜帶的通訊設備或者具有計算、存儲功能電子設備的；

（四）攜帶具有避開或者突破考場防范作弊的安全管理措施，獲取、記錄、傳遞、接收、存儲考試試題、答案等功能的程序、工具，以及專門用于作弊的程序、工具（以下簡稱作弊器材）的；

（五）搶奪、故意損壞他人試卷、答題卡（答題紙）、草稿紙等考場配發材料或者他人使用的考試機等設施設備的；

（六）違反規定將試卷、答題卡（答題紙）等考場配發材料帶出考場的；

（七）其他情節嚴重、影響惡劣的違規違紀行為。

第八條報考者在考試過程中有下列行為之一的，由省級以上公務員主管部門給予其取消本次考試資格并終身限制報考公務員的處理：

（一）使用偽造、變造或者盜用他人的居民身份證、準考證以及其他證明材料參加考試的；

（二）3人以上串通作弊或者參與有組織作弊的；

（三）代替他人或者讓他人代替自己參加考試的；

（四）使用本辦法第七條第四項所列作弊器材的；

（五）非法侵入考試信息系統或者非法獲取、刪除、修改、增加系統數據的；

（六）其他情節特別嚴重、影響特別惡劣的違規違紀行為。

第九條在閱卷過程中發現報考者之間同一科目作答內容雷同，并經閱卷專家組確認的，由具體組織實施考試的考試機構給予其該科目（場次）考試成績為零分的處理，錄用程序終止。作答內容雷同的認定方法和標準由省級以上考試機構確定。

報考者之間同一科目作答內容雷同，并有其他相關證據證明其作弊行為成立的，視具體情形按照本辦法第七條、第八條的規定處理。

第十二條報考者應當自覺維護公務員錄用工作秩序，有下列行為之一的，應當終止其錄用程序；情節嚴重、影響惡劣的，由設區的市級以上公務員主管部門給予其取消本次考試資格并五年內限制報考公務員的處理；情節特別嚴重、影響特別惡劣的，由省級以上公務員主管部門給予其取消本次考試資格并終身限制報考公務員的處理：

（一）故意擾亂考點、考場等工作場所秩序的；

（二）拒絕、妨礙工作人員履行管理職責的；

（三）威脅、侮辱、誹謗、誣陷、毆打工作人員或者其他報考者的；

（四）通過搞利益輸送或者利益交換，謀取考試資格、錄用機會、經濟利益以及其他不當利益的；

（五）購買本辦法第七條第四項所列作弊器材的；

（六）其他擾亂公務員錄用工作秩序的行為。

第十三條報考者在公務員錄用中有違規違紀行為，涉嫌違法犯罪的，移送有關國家機關依法處理。

報考者為國家公職人員的，應當將其違規違紀行為和處理結果通報所在單位。

各位報考者請仔細閱讀以上事項，科學備考、順利參考！

云南省人事考試院

2021年11月19日

來源：掌上春城

前端工作中，設計代碼時，經常會有人手動刪除行內元素之間產生的額外空隙，并通過設置margin或padding來獲取想要間距嗎？如代碼：

<div class=“”>去掉了間距去掉了間距去掉了間距去掉了間距去掉了間距去掉了間距</div>

這看起來很不舒服，特別扔給給JS同事后，JS同事看完代碼后就會提出抱怨，代碼太亂，他們希望的代碼是如下：

<div class="">
換行符產生間距
換行符產生間距
換行符產生間距
換行符產生間距
換行符產生間距
換行符產生間距
</div>

那么有什么好的辦法解決的？答案也是有的。

1.行內元素之間的“換行符”產生間距

換行符產生間距
換行符產生間距
換行符產生間距
換行符產生間距
換行符產生間距
換行符產生間距
</div>

展現效果如下：

2.行內元素之間使用“tab(制表符)”產生間距

展現效果如下：

3.行內元素之間使用“空格”產生間距

<div class="">換行符產生間距 換行符產生間距 換行符產生間距 換行符產生間距
換行符產生間距 換行符產生間距
</div>

展現效果如下：

上以上3點可以看出，行內元素之間產生的間距，是由于換行符、tab(制表符)、空格等字符引起，而字符的大小是定義字體大小來控制。

那么改變字體的大小可調整行內元素的間距么?

上圖把字體從0px~18px~36px的調整，可見行內元素之間的水平間距從無到有，并不斷變大，說明行內元素之間產生間距是由換行符、tab(制表符)、空格等字符引起的，那么設置字體大小font-size:0可以是不是可以在所有瀏覽器中除去這些間距呢？

經過測試后，可發現設置font-size:0并不能使得換行符、tab(制表符)、空格等在所有瀏覽器中產生的額外間距消失：

1.IE6、7瀏覽器始終存在的 1px 空隙

2.最新版本的Safari瀏覽器（5.1.7）不支持定義字體大小為 0 的瀏覽器

通過查找資料后，一種比較正常的解決方法如下：

1.針對IE6、7瀏覽器，使用word-spacing 修復 IE6、7 中始終存在的 1px 空隙，減少單詞間的空白（即字間隔）

*word-spacing:-1px;

2.使用webkit的私有屬性，讓字體大小不受設備終端的調整，可定義字體大小小于12px

html{-webkit-text-size-adjust:none;}

問題解決了，代碼如下：

結構：

<div class="span-wrap">
字符產生間距
字符產生間距
字符產生間距
字符產生間距
字符產生間距
字符產生間距
</div>

樣式：

html{
-webkit-text-size-adjust:none;/* 使用webkit的私有屬性，讓字體大小不受設備終端的調整，可定義字體大小小于12px */
}

.span-wrap {
font-size:0;/* 所有瀏覽器 */
*word-spacing:-1px;/* 使用word-spacing 修復 IE6、7 中始終存在的 1px 空隙，減少單詞間的空白（即字間隔） */
}

.span-wrap span{
font-size: 12px;
letter-spacing: normal;/* 設置字母、字間距為0 */
word-spacing: normal; /* 設置單詞、字段間距為0 */
}

干脆直接使用浮動，簡單，也不用寫多余的hack，多好。的確使用浮動技術是比較好的辦法，實際工作中我們使用浮動也是比較多，但是也并不是每處地方都要使用浮動，而且使用浮動后還需要清除浮動的操作。

文/丁向明

做一個有博客的web前端自媒體人，專注web前端開發，關注用戶體驗，加我qq/微信交流：6135833

http://dingxiangming.com

在線咨詢

上一篇：34道常見的HTML+CSS面試題（附答案）
下一篇：HTML5游戲的崛起及營銷未來

您的項目需求

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

整合營銷服務商

HTML代碼中的空格和空行

您的項目需求