如何擺脫空白而沒有過多的評論？

這裏是我的網頁的代碼片段：如何擺脫空白而沒有過多的評論？

<input value="Search" type="submit" /><!-- whitespace 
--><span class="vdivider"></span><!-- whitespace 
--></form><!-- whitespace 
--><form action="login_action.php" method="post"><!-- whitespace 
--><?php

那些空白的意見是獲得在分隔的每一側擺脫空白。這是否真的是唯一的方法呢？必須有一個更優雅的解決方案。

來源

2011-03-19 John Smith

難道只是把標記放在同一行。 – 2011-03-19 22:00:48

要考慮的一個選項 - 如果可以，請使用模板引擎。例如，在Smarty，有一個{strip}函數正是這樣做的：

{* the following will be all run into one line upon output *} 
{strip} 
<table border='0'> 
<tr> 
    <td> 
    <a href="{$url}"> 
    <font color="red">This is a test</font> 
    </a> 
    </td> 
</tr> 
</table> 
{/strip}

輸出：

<table border='0'><tr><td><a href="http://. snipped...</a></td></tr></table>

來源

2011-03-19 22:06:04 Czechnology

可以使用font-size:0黑客。基本上，您在父元素上設置了font-size:0，並在子級上顯式設置字體大小。

現場演示：http://jsfiddle.net/simevidas/mLZYW/1/

（演示沒有破解：http://jsfiddle.net/simevidas/mLZYW/）

來源

2011-03-19 22:07:41

空白只能說明當它是周圍或下一個內聯元素，所以至少在形式你鴕鳥政策需要它（如果你沒有設置你的表格到display:inline ...）。

定位或浮動的事情幾乎總是刪除不必要的空格，因此，例如，如果你的.vdivider應該是垂直分隔/新線，你可以在input使用display:block之前它並刪除該元素和圍繞它的評論。

來源

2011-03-19 22:08:40 jeroen

實際上，我做了，因爲我有兩個相鄰的表單（搜索和註冊/登錄），它們在同一行。 – 2011-03-19 22:12:37

@John Smith那就解釋一下吧:-)順便說一下，我不記得上一次我遇到空白問題了，我想我會傾向於浮動元素，當我希望它們彼此相鄰時，那就是我你可能也會這樣做。根據您的瀏覽器需要，您還可以使用諸如「display：inline-block」之類的東西。 – jeroen 2011-03-19 22:23:31

元素之間的空白（包括換行符和製表符）會導致瀏覽器插入空格，而空格應該沒有空格。

我見過用於解決這個問題的最優雅的方法是將>放在下一行，而不是放在同一行。這樣，它仍然是合法的html，你仍然可以保持漂亮。

例如：

<input value="Search" type="submit" /> 
    <span class="vdivider"></span> 
    </form><form action="login_action.php" method="post"> 
    <?php>

將成爲：

<input value="Search" type="submit" 
    /><span class="vdivider"></span 
    ></form><form action="login_action.php" method="post" 
    ><?php>

來源

2011-03-19 22:08:49 Ezra

如何擺脫空白而沒有過多的評論？

回答

相關問題