Difference between revisions of "CSS"
From Ilianko
| Line 13: | Line 13: | ||
След css | След css | ||
| + | <pre> | ||
<p>някакъв текст</p> | <p>някакъв текст</p> | ||
+ | + | ||
| Line 21: | Line 22: | ||
color: #ff0000 | color: #ff0000 | ||
} | } | ||
| − | + | </pre> | |
styles.css | styles.css | ||
<pre> | <pre> | ||
| Line 76: | Line 77: | ||
== Група от тагове == | == Група от тагове == | ||
| − | + | <pre> | |
<p class = "cherven" >Специален текст</p> | <p class = "cherven" >Специален текст</p> | ||
Конкретен таг | Конкретен таг | ||
<p id = "cherven" >Точно този текст</p> | <p id = "cherven" >Точно този текст</p> | ||
| − | + | </pre> | |
css | css | ||
Revision as of 12:35, 17 June 2011
Cascading Style Sheets (CSS) - служи за представяне на форматирането и външния вид на документи написани с markup language
Основната цел, с която е проектиран е отделянето на съдържанието на документа от неговия външен вид - шрифтове, фонове, цветове и т.н.
Пример
Преди css
<p> <font face="arial, helvetica, sans-serif" size="-1" color="#ff0000">някакъв текст</font> </p>
След css
<p>някакъв текст</p>
+
p
{
font-family: arial, sans-serif, helvetica;
font-size: 12px;
color: #ff0000
}
styles.css
<head> <title>Заглавие на страницата</title> <link rel=stylesheet type="text/css" href="styles.css" /> </head> <body> <p>Някакъв текст</p> </body> </html>
...
Вграждане на CSS: external, internernal, inline,
Internal
<head>
<title>Заглавие на страницата</title>
<styles>
p
{
font-family: arial, sans-serif, helvetica;
font-size: 12px;
color: #ff0000
}
</styles>
</head>
<body>
<p>Някакъв текст</p>
</body>
</html>
Inline
<head> <title>Заглавие на страницата</title> </head> <body> <p style="font-family: arial, sans-serif, helvetica; font-size: 12px; color: #ff0000">Някакъв текст</p> </body> </html>
Група от тагове
<p class = "cherven" >Специален текст</p> Конкретен таг <p id = "cherven" >Точно този текст</p>
css
.cherven
{
font-family: arial, sans-serif, helvetica;
font-size: 12px;
color: #ff0000
}
#cherven
{
font-family: arial, sans-serif, helvetica;
font-size: 12px;
color: #ff0000
}
/* Comment here */
@import "newstyles.css";
