css頁面問題

我在下面粘貼的代碼是爲了在中間2個鏈接上顯示沒有文字的圖像，並返回到復位和第四個鏈接上的文本。我已經設置了顯示：只有span標籤沒有，但它什麼也沒有做。無論如何，無論如何只是在不使用框架的情況下完成我的工作？css頁面問題

編輯：例如

<html> 
    <head> 
     <style type="text/css"> 
       .class1{color:#000; background-image:url('1.jpg');} 
     .class1 span { display: none;} 
       .class2{color:#00f; background-image:url('2.jpg');} 
     .class2 span { display: none;} 
       .class3{color:#0f0; background-image:url('1.jpg');} 
     .class3 span { display: none;} 
       .class4{color:#f00;} 

     </style> 
    </head> 
    <body> 
     <script type="text/javascript"> 
       function sbox(divid, classname) 
       { 
         document.getElementById(divid).className=classname; 
       } 
     </script> 
     <div> 
     <a href="#" onclick="sbox('div1','class1');return false;">Reset</a><br/> 
       <a href="#" onclick="sbox('div1','class2');return false;">try here</a><br/> 
       <a href="#" onclick="sbox('div1','class3'); return false;">or here</a><br/> 
       <a href="#" onclick="sbox('div1','class4');return false;">or maybe here</a> 
     </div> 
     <div id="div1" class="class4"><span id="div1_text">Blah blah blah</span></div> 
    </body> 
</html>

來源

2008-12-03 Joshxtothe4

我認爲你需要修復問題的格式。 – 2008-12-03 12:09:46

你錯過了參考的例子。 – tvanfosson 2008-12-03 12:12:03

的rel屬性應該描述的鏈路的關係，以當前文檔。它應該具有here中描述的值之一。 DIV是塊級分組元素，而SPAN是內聯分組元素。 SPAN允許您將文本和標籤分組在一起以達到某種目的（常見樣式等），而無需更改標記流。

編輯：這個問題從我的下面改變了出來，所以上面看起來真的與當前的上下文無關。

你需要像@llandril說的那樣給DIV一些大小。我會建議給DIV固定的寬度和高度 - 要麼總是使用顯示圖像的類之一。如果要顯示整個事物，請使用背景圖像的寬度和高度。您可能還需要提供一些內容，但我不這麼認爲。

這是class1的樣子，我想。我沒有測試過這個。

/* in case color needs to apply to other elements */ 
    .class1 { color: #000; } 

    div .class1 { 
     background-image:url('1.jpg'); 
     width: 60px; 
     height: 30px; 
    } 

    div .class1 span { display: none;}

來源

2008-12-03 12:16:06 tvanfosson

他不應該改變他的選擇器的順序。他希望用css class「class1」更改對象內的跨度顯示，而不是顯示位於跨度內的具有「class1」的對象。他的選擇器的順序對他正在嘗試做的是正確的。 – Illandril 2008-12-04 15:09:36

我明白你的意思了。我想我誤解了這個例子，並假設span也是class1。他實際上是匹配任何包含span的className class1的元素。我傾向於更準確地遵守我的規則。更新我的例子。 – tvanfosson 2008-12-04 15:50:47

rel屬性通常不被許多UA（用戶代理）使用，但是它指定了鏈接頁面與當前頁面的關係。

例如Mozilla使用prefetch relation預加載頁面時出現了某些僞標準。 Google設置[用於設置？]其前幾個結果以這種方式預取，因此這些頁面應該加載更快。

其他例子是基於瀏覽器的導航欄（Opera有這些例如一個）鏈接到下一個，上，內容頁面等，這也適用於<link>元素

來源

2008-12-03 12:20:30 Gareth

DIV標籤包圍的塊內容。 span標籤類似，但包含內聯內容。區別？您可以使用span來設置段落內的短語，但是div可以包裝該段落並將其與其他段落分開。請參閱this的div，this的跨度。

一些意見後，現在就是，from the horse's mouth:

的DIV和SPAN元素，與id和class屬性相結合，提供加入結構文檔的常規機制。這些元素將內容定義爲內聯（SPAN）或塊級（DIV），但不在內容上強加其他表示方式。因此，作者可以將這些元素與樣式表，lang屬性等一起使用，以根據自己的需要和口味調整HTML。

來源

2008-12-03 12:22:32

rel也可用於描述其他語義，見the microformats rel docs

來源

2008-12-03 12:25:10 meleyal

通常，屬性REL和rev分別描述前向和後向指向的鏈接。例如，在列表分頁中，您可以使用<a href="..." rel="next">Next</a>和<a href="..." rev="prev">Prev</a>

請參閱http://www.w3.org/TR/html401/types.html#type-links瞭解您可以使用的某些值。

其他人已經解釋了span/div標籤。實際上並沒有多少使用span標籤的情況，因爲根據上下文，您通常可以使用em，strong，code等短語元素。因爲當你的跨度走了它不具有任何內容

來源

2008-12-03 13:04:15 DisgruntledGoat

的DIV不顯示背景圖片。

添加非中斷空間（& NBSP;）跨度後將給它的內容。

來源

2008-12-03 15:18:17 Illandril

回答

相關問題