圍繞在跨度的所有內容在div - 爲什麼？

在我們從「psd2html」服務中獲得的代碼中，我看到很多圍繞div標籤內容的跨度。圍繞在跨度的所有內容在div - 爲什麼？

我知道跨度和div之間出現的差異，但我無法弄清楚，爲什麼代碼如下所示：

<div class="forgot-password"> 
    <span><a href="/forgotpassword/">Forgot password?</a></span> 
</div> 
... 
<div> 
    <span>Sign in</span> 
</div>

而不只是：

<div class="forgot-password"> 
    <a href="/forgotpassword/">Forgot password?</a> 
</div> 
... 
<div> 
    Sign in 
</div>

我猜它要麼一些一種跨瀏覽器修復，或者如果我們想把更多東西放到div中，爲了未來「準備」？

編輯： 下面是忘記密碼部分CSS：

div.forgot-password 
{ 
    float: left; 
    width: 145px; 
    height: 22px; 
    margin-left: 3px; 
} 

div.forgot-password span 
{ 
    display: block; 
    float: left; 
    padding-top: 3px; 
    padding-left: 0px; 
} 

div.forgot-password span a 
{ 
    color: #C5C5C5; 
    text-decoration: none; 
}

來源

2009-12-14 truppo

儘管純文本可以在div中「裸」，但有些人認爲使用內聯標記（如跨度）包裝文本內容是一種很好的做法。這意味着您可以從塊樣式中分離出內聯樣式。關於你的psd2html服務，你所看到的是轉換算法的一個假象。任何算法只會有一套有限的規則。在這種情況下，我猜測有一個規則，比如「在一個範圍中包裝文本」，以及諸如「在一個包裝中包裝鏈接」的規則。在你上面的例子，所有的文本內容是一個鏈接，讓你看到

<span><a..>text content</a></span>

從HTML的角度來看，在這種情況下，外跨度是不必要的。然而它並沒有造成任何傷害，並且爲了造型的目的 - 除非你想改變CSS - 你需要保留它們。

來源

2009-12-14 13:11:22

對我來說，它看起來像過於複雜的代碼。這是有道理的，如果代碼是：

<div class="forgot-password"> 
    <span> some text </span> <a href="/forgotpassword/">Forgot password?</a> 
</div>

這樣你就可以區分CSS或jQuery中的文本和鏈接。

在這裏，我們應該看看CSS做什麼，但我的第一印象是跨度可以被刪除，因爲它們沒有語義或操作意義。

來源

2009-12-14 12:56:43 marcgg

對我而言，span一直是以css兼容方式快速格式化文本的一種方式。所以我會假設他們添加跨度來準備進一步的格式化，但是由於沒有給出格式，他們不應用任何樣式表，因此跨度是「空的」。

我想說，這些跨度也可以刪除。在這種情況下他們不會受到傷害，但他們在這裏沒有任何用處。

來源

2009-12-14 12:57:59

它看起來像這些按鈕被標記在這裏，所以它可能被用於Sliding Doors技術，所以你可以有兩個背景圖像，所以如果內容增長，你仍然會有很好的角落。這可能只是他們在所有看起來像按鈕的東西上所做的事情，但他們可能不會在任何地方充分利用它。

來源

2009-12-14 13:15:47 nickf

圍繞在跨度的所有內容在div - 爲什麼？

回答

相關問題