基本的CSS概念

Question

經過與我的一些朋友討論css概念後，我有一些問題要問你們。

我們什麼時候在css中使用Id和class？我們與Div和Span有衝突的想法。 Div和Span何時使用？

這些問題的任何關鍵？

Answer 1

div用作文檔的一部分。 span用於設置文本的各個部分。一個關鍵的區別是div會在任何一邊插入換行符。

但是div和span是HTML而不是CSS。

如果存在某個元素並且需要唯一標識該元素，則使用id。 如果有多個要應用相同樣式的元素，則使用class。

Answer 2

基本規則是一個ID可能只在整個頁面中存在一次。該ID通常用於標識頁面中的對象。大多數時候你會在CSS中使用類。

span是一個內聯元素，div是一個block元素（默認情況下，你可以在你的CSS中覆蓋它）。跨度通常在文本塊內用於「標記」一段文本。 div用於對容器中的對象進行分組。

希望這可以幫助你一點。

Answer 3

Should I use id or class?

的div元素是網頁的一個部門。這是一個塊元素。

span元素用於包圍一段文本。這是一個內聯元素。

實施例：

<div> 
    This is one part of <span>the page</span>. 
</div> 
<div> 
    This is another part of <span>the page</span>. 
</div> 

可以使用樣式display:block或display:inline控制元素的類型。塊元素可以包含其他塊元素和內聯元素。內聯元素可以包含其他內聯元素，但不能包含塊元素。

例如一個鏈接（a標籤）是一個內聯元素，因此您可以在其中放置span標籤，但不能放置div標籤。您可以使用display樣式將鏈接設置爲塊元素，並且其中的元素可以阻止元素。即使你已經使用CSS創建鏈接塊元素，它仍應該只包含默認內聯的元素，即使你也使用CSS將這些元素轉換爲塊元素。

Answer 4

div和span是HTML標籤。你可以使用CSS對它們進行風格化，但正因爲如此，它們是純html元素。

Div主要用作包裝程序塊，您可以定位，設置樣式和尺寸，然後將內容放入其中，但是如果用作內聯塊，它也可以執行跨度功能。 跨度應該用於突出顯示段落標記內的一些文本，或者將某些特定樣式應用於標題，列表，錨點（等）標記之間的一些文本。

（＃ - id）被使用，並且應該用於不在頁面上重複的唯一元素。

（。 - class）用於必須繼承相同屬性的一組元素。

例如，表單域可能有一個id和一個類，這個ID會使它們很容易用javascript來高亮顯示，而類將應用基本的樣式。

Answer 5

ID是爲頁面上的元素提供的唯一名稱。一個例子是'product_98509'。類是對頁面上一個或多個元素的非唯一引用。例如「產品」。然後，在使用CSS時，您可以使用'.product {}'引用所有產品，使用'＃product_98509 {}'引用特定產品。

A是爲箱子和容器設計的塊級元素。例如標題欄，引用框等.A是文本中通常使用的內嵌元素。例如某個段落中的某人的姓名，產品說明中的價格等。

希望能有所幫助！

Answer 6

id屬性標識一個頁面上的元素。它用於指定一個非常具體的元素，除非您有充分的理由這麼做，否則不應該在元素上切換id。在一頁上使用相同的id兩次被認爲是無效的。

class屬性是元素上的「形容詞」。它指定了與其他元素不同的相同元素。例如，<ul>元素可能是特定的，因爲它用於待辦事項列表，因此您可以將其指定爲<ul class="todo">。您可以在同一頁面上擁有多個具有相同類的元素。

<div>和<span>的用途類似之處在於它們都指定通用內容。它們的區別在於<div>爲區塊內容和<span>爲內嵌內容。在內聯內容中放置塊內容被認爲是無效的，但對於相反的內容（塊內嵌或塊內阻）則不適用。

Answer 7

通常，如果您有特定的（獨特的）元素和類，當你有許多相同樣式的元素時。

通常情況下，我將使用ID來定義頁面（主容器，頁眉，頁腳，側邊欄等）中的「結構」元素，並使用其他所有類。

具有ID的元素通常更方便通過javascript訪問（儘管jQuery緩解了這一點），所以我經常在需要被javascript操作的元素上使用ID，即使沒有樣式關聯ID。

Answer 8

id唯一標識一個DOM元素。 class標識一組相關的DOM元素。

div默認情況下具有display: block，通常用於劃分應該在一個塊中的元素的某些邏輯分組。 span默認爲display: inline，通常用於將樣式應用於文本的各個部分。

Answer 9

正如Mike提到的DIV和SPAN是HTML元素。兩者都是純粹的內容包裝，但作爲一般規則，span用於包裝文本字符串，div用於包裝內容塊。

將span視爲一個「內聯」元素，將一個顏色應用於句子中的某個單詞與div是一個「塊」，您可能需要添加邊框，設置寬度和高度等。

注意：因爲CSS很靈活，所以可以讓div做任何跨度的事情，反之亦然。

Answer 10

我建議閱讀也是這個：

Difference between DIV as-is and a SPAN with display:block

Answer 11

這裏來DIV和跨度 html標籤的小簡短說明。與層疊樣式表打交道時

的跨度和DIV標籤是非常有用的。人們傾向於以相似的方式使用這兩個標籤，但它們的用途各不相同。

div也爲您提供了定義整個HTML部分樣式的機會。您可以將頁面的一部分定義爲調出，併爲該部分提供與周圍文本不同的風格。

div標籤還使您能夠命名文檔的某些部分，以便您可以使用樣式表或動態HTML來影響它們。

使用div標記時要記住的一件事是它會打破段落。它作爲一個段落結束/開始，雖然你可以有段落在div你不能有段落內的div。

的跨度標籤具有非常相似性質的DIV標籤，因爲它改變它包圍文本的樣式。但沒有任何樣式屬性，範圍內的標籤根本不會更改所包含的項目。

的跨度和DIV標籤之間的主要區別是，跨度沒有做它自己的任何格式。 div標記行爲包含段落中斷，因爲它定義了文檔中的邏輯分隔。 範圍標記只是告訴瀏覽器將樣式規則應用於範圍內的任何內容。

Answer 12

1）我使用id的時候，我知道頁面上只有1個，我使用class時可以有多個。例如，您的標題只有一個，所以我使用該標識。

2）Divs/Spans - 其他人都說過的......顯示塊vs內聯。

（這只是一個低級CSS開發人員的做法）。

Answer 13

如上所述，這實際上是一個HTML問題，雖然不是一個你通常會遇到，除非你使用的CSS（爲什麼任何人都會嘗試和實現完美的語義，與負載的樣式凌亂的文件???）

div和span

兩個div和span純粹是用於提供其內容的邏輯分組HTML元素。 Div是一個塊元素，因此它是一個具有寬度，高度，邊距和填充的矩形區域。跨度是內聯元素，因此上述內容不適用，但它可以跨越多行。

應該指出的是，任何段落都可以打破，所以不應該包含在內。但是，它可以包含其他段落和塊級別元素而不會自行破壞。

類和ID

ID屬性被用於唯一地標識一個HTML文檔內的給定標籤。當你想要設置一個樣式，並且只有一個樣式時，你可以在CSS中使用class屬性。 Class屬性描述了一個屬性的類型。例如，考慮以下內容：

<div class="widget"></div> 
<div class="widget"></div> 
<div class="widget"></div>