2017-02-22 125 views
0

我有以下问题:
无论我在CSS文件中做了哪些修改,它都不会影响我的目标HTML文件。
它以前被命名为“index.html”(方括号创建了一个副本 - 我是HTML/CSS的新手),修改只发生在该页面上。 我应该在HTML代码中放置样式表链接?头?身体? 下面是HTML代码:我应该在HTML代码中放置样式表链接?

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <Title>Acasa</Title> 
 
    </head> 
 
    <body background=".\images\colaj.jpg"> 
 
     <link rel="stylesheet" href=".\acasa\acasa.css"> 
 
     <embed src=".\music\fundal gloante.mp3" loop="true" autostart="true"      hidden="true" > 
 
     <br/> 
 
     <center> 
 
     <img src=".\images\Presentation1.png"text-align: center; border="10" > 
 
     </center> 
 
    
 
<br/><br/> 
 
    <center><ul> 
 
     <li><a href="cuvant.html" >Cuvant inainte</a></li> 
 
     <li><a href="\site\preview\neutralitate.html">Anii de neutralitate</a></li> 
 
     <li><a href="galerie.html">Intrarea in razboi</a></li> 
 
\t <li><a href="galerie.html">Razboiul</a></li> 
 
\t <li><a href="colaj.html">Dambovita in razboi</a></li> 
 
     <li<a href="C:\Users\Andrei\Documents\scoala\istorie\site\preview\T.html">Galerie Video</a></li> 
 
     <li><a href="C:\Users\Andrei\Documents\scoala\istorie\site\preview\T.html">Galerie Foto</a></li> 
 
     <li><a href="C:\Users\Andrei\Documents\scoala\istorie\site\preview\T.html">Bibliografie</a></li> 
 
    </ul> 
 
    </center> 
 
    <br/><br/><br/> 
 
    </body> 
 
</html>
而CSS:

ul { 
 
    list-style-type: none; 
 
    margin: 0; 
 
    padding: 0; 
 
    width: 200px; 
 
    background-color: rgb(200,30,30); 
 
    border: 1px solid #555; 
 
} 
 

 
li a { 
 
    display: block; 
 
    color: rgb(255,255,255); 
 
    padding: 8px 16px; 
 
    text-decoration: none; 
 
} 
 

 
li { margin: auto;font-family: "Arial Black", Gadget, sans-serif; 
 
    text-align: center; 
 
    border-bottom: 1px solid #555; 
 
} 
 

 
li:last-child { 
 
    border-bottom: none; 
 
} 
 

 
li a.active { 
 
    background-color: rgb(128,128,128); 
 
    color: white; 
 
} 
 

 
li a:hover:not(.active) { 
 
    background-color: #555; 
 
    color: white; 
 
}

问题是什么? 对不起,长的code.Please告诉我,我犯了什么错误,我是这个完全新的。

+0

你应该把它的头标签内 –

回答

0

对于你的具体问题,我同意其他答案。包括CSS在<head>...</head>

但是,根据您的浏览器,您的潜在问题可能是您在路径中使用了反斜杠。使用正斜杠。尝试引用样式表为./acasa/acasa.css(假设CSS文件事实上位于相对于html文件所在位置的子目录acasa中)。

0

始终把你的CSS页面

0

的头部内的head标签里面象下面这样:

<head> 
 
<style type="text/css"> 
 
    ul { 
 
    list-style-type: none; 
 
    margin: 0; 
 
    padding: 0; 
 
    width: 200px; 
 
    background-color: rgb(200,30,30); 
 
    border: 1px solid #555; 
 
} 
 

 
li a { 
 
    display: block; 
 
    color: rgb(255,255,255); 
 
    padding: 8px 16px; 
 
    text-decoration: none; 
 
} 
 

 
li { margin: auto;font-family: "Arial Black", Gadget, sans-serif; 
 
    text-align: center; 
 
    border-bottom: 1px solid #555; 
 
} 
 

 
li:last-child { 
 
    border-bottom: none; 
 
} 
 

 
li a.active { 
 
    background-color: rgb(128,128,128); 
 
    color: white; 
 
} 
 

 
li a:hover:not(.active) { 
 
    background-color: #555; 
 
    color: white; 
 
} 
 
    </style> 
 
    </head>

1

header部分将这个:

<link rel="stylesheet" type="text/css" href="PATH_TO_CSS_HERE"> 

下面是一个完整的h eader从我的页面之一:

<head> 
    <title>My Page</title> 
    <link rel="stylesheet" type="text/css" href="css/style.css"> 
</head> 
0

它可能不是一个编码问题。也许你的网络浏览器并不总是重新加载css.`

它发生在我身上很多与歌剧,通常与ctrl+f5重新加载做的伎俩。

0

如果你想使用内部样式,那么你可以把你的CSS放在头部内的<style></style>块。请参阅附件代码。

但是,我会建议你通过MDN How CSS works页面,并通过基础知识。还要检查如何通过内部样式表,外部样式表导入css &内联样式表。

<!DOCTYPE html> 
<html> 

    <head> 

    <Title>Acasa</Title> 
    <style> 
     ul { 
     list-style-type: none; 
     margin: 0; 
     padding: 0; 
     width: 200px; 
     background-color: rgb(200, 30, 30); 
     border: 1px solid #555; 
     } 

     li a { 
     display: block; 
     color: rgb(255, 255, 255); 
     padding: 8px 16px; 
     text-decoration: none; 
     } 

     li { 
     margin: auto; 
     font-family: "Arial Black", Gadget, sans-serif; 
     text-align: center; 
     border-bottom: 1px solid #555; 
     } 

     li:last-child { 
     border-bottom: none; 
     } 

     li a.active { 
     background-color: rgb(128, 128, 128); 
     color: white; 
     } 

     li a:hover:not(.active) { 
     background-color: #555; 
     color: white; 
     } 

    </style> 
    </head> 

    <body background=".\images\colaj.jpg"> 
    <link rel="stylesheet" href=".\acasa\acasa.css"> 
    <embed src=".\music\fundal gloante.mp3" loop="true" autostart="true" hidden="true"> 
    <br> 
    <br> 
    <center> 
     <img src=".\images\Presentation1.png" text-align: center; border="10"> 
    </center> 

    <br> 
    <br> 
    <br> 
    <br> 

    <center> 
     <ul> 
     <li><a href="cuvant.html">Cuvant inainte</a></li> 
     <li><a href="\site\preview\neutralitate.html">Anii de neutralitate</a></li> 
     <li><a href="galerie.html">Intrarea in razboi</a></li> 
     <li><a href="galerie.html">Razboiul</a></li> 
     <li><a href="colaj.html">Dambovita in razboi</a></li> 
     <li><a href="C:\Users\Andrei\Documents\scoala\istorie\site\preview\T.html">Galerie Video</a></li> 
     <li><a href="C:\Users\Andrei\Documents\scoala\istorie\site\preview\T.html">Galerie Foto</a></li> 
     <li><a href="C:\Users\Andrei\Documents\scoala\istorie\site\preview\T.html">Bibliografie</a></li> 
     </ul> 
    </center> 
    <br> 
    <br> 
    <br> 
    <br> 
    <br> 
    </body> 

</html> 
0
<!DOCTYPE html> 
<html> 
<head> 

<title>Title of the document</title> 

<meta http-equiv="content-type" content="text/html;charset=UTF-8"/> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"/> 
<meta name="viewport" content="width=device-width, initial-scale=1"/> 
<meta name="description" content=""/> 
<meta name="author" content=""/> 

<link rel="shortcut icon" href=""/> 
<link href="yourcssfile.css" rel="stylesheet" type="text/css"/> 
<!--or you can add directly here css codes --> 
<style type="text/css"> 
ul { 
    list-style-type: none; 
    margin: 0; 
    padding: 0; 
    width: 200px; 
    background-color: rgb(200,30,30); 
    border: 1px solid #555; 
} /*bla bla bla ........ this is Comment line*/ 
</style> 

<script src="yourscriptfile.js" type="text/javascript"></script> 
<!--if you want you can put the script files 
before </body> tag for the site to be fast --> 

</head> 

<body> 
    The content of the document...... 
</body> 

</html> 

,你可以看看这个网站for learn about first html and css notes

相关问题