все о заработке в интернете
инфо-бизнесе с нуля, электронной коммерции
Мой профиль Вконтакте

Внутренние или внешние каскадные таблицы стилей

Каскадные таблицы стилей могут использоваться внутри или снаружи — то есть, вы можете добавить ваш код стиля непосредственно на свою страницу или поместить его в отдельный код стиля и сделать ссылку на него.

Это базовая концепция, но так как не всем знакомы каскадные таблицы стилей (CSS), и так как почти все блоги использовать его, я подумал, что было бы целесообразно разместить небольшую статью по этому поводу.

Каскадные таблицы стилей

Внутренние таблицы стилей

Вот основной код HTML-страницы.

<html>
<head>
<title>Site name</title>
</head>
<body>Site content

</body>
</html>

Если вы хотите разместить код CSS внутри страны, что может быть предпочтительным, если вы не используете каскадные таблицы стилей в большом количестве и хотите использовать тег <style type="text/css">.

Внутри этого тега вы помещаете ваш CSS код следующим образом:

<html>
<head>
<title>Site name</title>
<style type="text/css">

Ваш css здесь, например,

body {
font-size: 62.5%; /* Resets 1em to 10px */
font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
background: #d5d6d7 url ('images/kubrickbgcolor.jpg');
color: #333;
text-align: center;
}
</style>
</head>
<body>

Внешние каскадные таблицы стилей

Если у вас есть много каскадных таблиц, то имеет смысл хранить все ваши CSS коды в отдельном файле. Все, что нужно сделать, это скопировать код CSS в пустой файл и сохранить его с расширением .css. В большинстве случаев его называют что-то вроде style.css или stylesheet.css, но вы можете называть это как хотите.

Для ссылки на ваш css код, вам нужно использовать следующий код:

link rel="stylesheet" type="text/css" href="stylesheet address" />

На вашей странице этот код будет заключен в теге HEAD следующим образом:

<html>
<head>
<title>Your Blog</title>
<link rel="stylesheet" type="text/css" href="http://www.yourblog.com/wp-content/themes/default/style.css" mce_href="http://www.yourblog.com/wp-content/themes/default/style.css" />
</head>
<body>

Наверное, не слишком понятно, что написано, но я уверен, вы сможете понять это, глядя на таблицу стилей вашего блога.
Удачи!

Понравилась статья? Поделитесь с друзьями!