Основы работы с CSS

       

Примеры использования CSS


Рассмотрим несколько примеров использования CSS:

  1. Технология CSS позволяет связываться с внешней таблицей стилей. Для этого в файле HTML применяют тег <link>:

    <html>

    <head> <link rel="stylesheet" type="text/css" href="http://www.intuit.ru/image/style.css"> </head>

    <body>

    <ol><!—Список имеет внешний отступ в 10 пунктов --> <li>для этого элемента списка будет задан шрифт "arial"</li> <li>для этого элемента списка будет задан шрифт "arial"</li> </ol>

    <ul><!—Список имеет внешний отступ в 20 пунктов --> <li>для этого элемента списка будет задан шрифт "arial"</li> <li>для этого элемента списка будет задан шрифт "arial"</li> </ul>

    </body> </html>

    Внешний файл содержит следующее описание стилей (style.css):

    ol {margin-left: 10pt} ul {margin-right: 20pt} li {font-family: arial}

  2. Следующий файл HTML связывается с внешней таблицей стилей с помощью тега <link>:

    <html> <head> <link rel="stylesheet" type="text/css" href="http://www.intuit.ru/image/style2.css">: </head>

    <body>

    <table> <tr> <td>Ячейка 1</td> <td>Ячейка 2</td> </tr> </table>

    <a href="http://www.intuit.ru">Здесь размещена ссылка</a>

    </body> </html>

    Внешний файл содержит следующее описание стилей (style2.css):

    body {background-color: #FFFFFF)} table {margin-left: 10pt;} td {font-size:10pt; color: blue} a:link {color:blue} a:visited {color:brown} a:hover {color:lime} a:active {color:gray}.



Содержание раздела