1 HTML 5 DOCTYPE html head titletitle meta
- Slides: 20
Виды стилей 1)Внедренные в страницу HTML 5 <!DOCTYPE html> <head> <title></title> <meta content=""> <style></style> </head> <body></body> </html> 2)Встроенные в страницу HTML 5 <!DOCTYPE html> <head> <title></title> <meta content=""> </head> <body></body> </html> 3)Внешние <!DOCTYPE html> <head> <title></title> <link rel='stylesheet' href='css/contact. css'/> </head> <body></body> </html>
ID селектор #abzac { font-weight: bold; }
Цвета в CSS 1)color: rgb(0. 0. 255); 2)color: blue; 3)color: #fff; color: #ffffff; Цветовая палитра
margin, padding. first { width: 200 px; height: 200 px; border: 2 px solid green; margin: 200 px 100 px; }. two { width: 200 px; height: 200 px; border: 2 px solid red; padding: 200 px 100 px; } m a r g i n Пример h e ii g h t width p a d d i n g
Стили для текста font-family: verdana, Tahoma; -шрифт font-size: 12 pt-размер шрифта font-weight: bold; -жирность font-style: (oblique-наклонный; italic-курсив); text-indent: 40 px; красная строка text-decoration: (none, overline; underline, line-through) подчеркивание text-align: (center; right; center; left) выравнивание Пример
Добавление фона на сайт body { background: #00 ff 00 url("smiley. gif") no-repeat fixed center; } h 1 { background-color: #00 ff 00; } div { background-image: url("paper. gif"); background-color: #cccccc; } Пример
<!DOCTYPE html> <head> <meta charset="utf-8"> <title>position</title> <style>. layer 1 { position: relative; /* Относительное позиционирование */ background: #f 0 f 0 f 0; /* Цвет фона */ height: 200 px; /* Высота блока */ }. layer 2 { position: absolute; /* Абсолютное позиционирование */ bottom: 15 px; /* Положение от нижнего края */ right: 15 px; /* Положение от правого края */ line-height: 1 px; } </style> </head> <body> <div class="layer 1"> <div class="layer 2"> <img src="images/girl. jpg" alt="Девочка" /> </div> </body> </html> Пример