2017-02-22 5 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; 
 
}

В чем проблема? Извините за длинный код. Пожалуйста, скажите мне, какую ошибку я делаю, я совершенно новичок в этом.

+0

Вы должны поместить его в голову тег –

ответ

0

Для вашего конкретного вопроса, я согласен с другими ответами. Включите CSS в <head>...</head>.

Однако, в зависимости от вашего браузера ваша основная проблема может заключаться в том, что вы используете обратные косые черты на своих путях. Используйте косые черты. Попробуйте ссылаться на таблицу стилей как ./acasa/acasa.css (предполагая, что файл CSS фактически находится в подкаталоге acasa относительно того, где находится html-файл).

0

Всегда положить CSS в голове страницы

0

Внутри головы теге, как показано ниже:

<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

Put это в 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.`

Это случается со мной с Opera, обычно с перезагрузкой с ctrl+f5 делают трюк.

0

Если вы хотите использовать внутренний стиль, вы можете поместить свой css в блок <style></style> внутри головы. См. Прилагаемый код.

Я бы предложил вам пройти через страницу MDN How CSS works и ознакомиться с основами. Также проверьте, как css можно импортировать через внутренние таблицы стилей, таблицы внешних стилей & Inline stylesheets.

<!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

Поскольку вы используете внешние файлы CSS, он всегда должен находиться в разделе HTML-страницы. Пожалуйста, обратитесь к https://www.w3schools.com/css/css_howto.asp за дополнительной информацией.

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

 Смежные вопросы

  • Нет связанных вопросов^_^