Если вы посмотрите по стронам, то увидете, что все рамки на нашем сайте офрмлены с помощью CSS.
Делается это очень легко!
Расмотрим два способа создание стилей. Эти способы применяются не только для создания красивых рамок, но и для всего (текст, картинки, теги и тд.)
Способ #1
В блоке служебных тегов <head> пишем таблицу стилей, как указано внизу:
<head><br>
<style type="text/css"><br>
<!--<br>
.mainborder {border: 1px solid #000000;}<br>
--><br>
</style><br>
</head>
Придумываем название стиля латинскими буквами и пишем через точку .mainborder в круглых скобках перечисляем нужные нам параметры.
Для того, что бы созданный нами созданный стиль отображался на нашей таблице нужно к тегу <table> применить класс с именем которое мы указали в таблице стилей в служебном блоке <head>:
<table width="186" align="center" class="border_big_td"><br>
<tr><br>
<td><p>Таблица в одну строку и одну ячейку.</p></td><br>
</tr><br>
</table>
А теперь давайте расмотрим какие есть атрибуты для рамок. [201x432]
Атрибут который понравился мы прописываем в круглых скобка созданного нами стиля:
<head><br>
<style type="text/css"><br>
<!--<br>
.border {<strong>border: 3px double gray;</strong>}<br>
--><br>
</style><br>
</head>
Расмотрим второй приём применения таблици стилей CSS
Способ #2
Для создания таблици стилей в этом варианте мы используем отдельный файл с расширением .css Обычно этот файл называют style.css. В этом файле мы и прописываем все стили и переопределения тегов.
Но в этом случае мы уже не пишем
<style type="text/css">
<!--
-->
</style>
Прописываем только сами стили, например:
.border { /*Это созданный стиль*/
border-top : 1px solid #0099FF; margin:5px;
border-bottom : 1px solid #0099FF; margin:5px;
border-left : 1px solid #0099FF; margin:5px;
border-right : 1px solid #0099FF; margin:5px;
}
p { /*Это переопределение тега p*/
font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size : 13px;
margin : 10px;
text-align:left;
text-indent:20px;
}
После того как мы создали отдельный файл style.css и прописали все стили, нам нужно его присоединить к html странице на которой указаны классы из этой таблицы стилей.
Делается это очень легко! Всего с помощью одной строчки в блоке служебных тегов <head>
Прописываем вот такую строчку:
<link href="style.css" rel="stylesheet" type="text/css">
Сам файл style.css должен находиться в тойже папке, что и все файлы вашего сайта.
<head><br>
<link href="style.css" rel="stylesheet" type="text/css"><br>
</head>
Если вы используете Adode Dreamweawer CS-3 постмотрите урок Подцепляем таблицу стилей в программе Adode Dreamweawer CS-3, урок сдесь
ВНИМАНИЕ! | ![]() |
"Все Технические Моменты Онлайн Бизнеса в Видеоформате", которая позволит Вам быстро и легко овладеть всеми техническими моментами ведения бизнеса в сети, через наглядные примеры с аудиокомментариями. |
Предупреждение: Данный материал предназначен только для серьёзных людей, которые действительно готовы учиться и применять полученные знания на практике. Информации в курсе достаточно много и большая её часть имеет практическую направленность, поэтому требует тщательной проработки и обязательного практического применения. Здесь Вы не найдете туманной информации о том "что делать", Вы найдете только то, что отвечает на вопрос "как делать?". |