2013-12-22 32 views
0
<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset=「UTF-8」 /> 
    <title>Footer Design</title> 
    <link rel=「stylesheet」 type=「text/css」 href=「style.css」 /> 
    </head> 

    <body> 
    <div id=「footer」> 
     <div id=「footer-col-one」> 
     <h3>Categories</h3> 
     <ul> 
      <li>Snow</li> 
      <li>Surf</li> 
      <li>Travel</li> 
     </ul> 
     </div> 

     <div id=「footer-col-two」> 
     <h3>Navigation</h3> 
     <ul> 
      <li>Home</li> 
      <li>About</li> 
     </ul> 
     </div> 

     <div id=「footer-col-three」> 
     <h3>Follow Me</h3> 
     <ul> 
      <li>Facebook</li> 
      <li>Twitter</li> 
      <li>Instagram</li> 
     </ul> 
     </div> 
    </div> 
    </body> 
</html> 

由於某些原因,我無法獲取我的CSS樣式表來應用。它不是這個html文件的同一個目錄。我正在使用TextEdit並將其設置爲使用html & css。我也注意到,在任何地方我有雙引號我得到的Chrome開發者工具一些奇怪的輸出類似如下:無法將CSS應用到HTML文件

<link rel=“stylesheet†type=“text/css†href=“style.css†/> 
+0

糟糕的代碼表明瞭在Chrome開發者工具是這樣的:! <鏈接的rel = A€œstylesheetâ€類型= A €文/綜援€HREF = A€œstyle.cssâ€/> – user3127783

+1

壞的複製/粘貼?替換所有雙引號。 –

+0

請提供您的目錄結構的列表。 – Enijar

回答

6

不能界定HTML屬性值與字符,則必須使用"'

zoomed in screenshot of the above text

左/右的報價將被視爲值(因此URL),而不是作爲HTML特殊字符的一部分。

您的問題很可能是由於使用帶有智能引語的字處理器編寫代碼而導致的。使用文本編輯器(我喜歡Sublime Edit 2自己,但還有許多其他優秀的選擇,例如Komodo Edit和Brackets)。

如果你有used a validator,這將會被拿起(儘管不是很明確)。

+0

我甚至沒有看到第一次看到他的代碼,好點。 – Enijar

+0

另外,除了一些特殊情況外,引號可以省略,例如,不需要引號。 –

+0

謝謝!這正是我的問題! – user3127783

0

請使用此源格式。請勿使用「。使用「。如果你的style.css文件在另一個位置意味着假設style.css是在css文件夾中,所以給路徑如href =」css/style.css「

希望答案,並在下面使用我已經修改HTML代碼

頁腳設計

<body> 
<div id="footer"> 
    <div id="footer-col-one"> 
    <h3>Categories</h3> 
    <ul> 
     <li>Snow</li> 
     <li>Surf</li> 
     <li>Travel</li> 
    </ul> 
    </div> 
    <div id="footer-col-two"> 
    <h3>Navigation</h3> 
    <ul> 
     <li>Home</li> 
     <li>About</li> 
    </ul> 
    </div> 
    <div id="footer-col-three"> 
    <h3>Follow Me</h3> 
    <ul> 
     <li>Facebook</li> 
     <li>Twitter</li> 
     <li>Instagram</li> 
    </ul> 
    </div> 
</div> 
</body> 
</html>