2013-12-22 33 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>