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


Примеры


  1. Данный пример показывает, как задать фоновый цвет элемента.

    <html> <head>

    <style type="text/css"> ul {background-color: rgb(200,10,200)} ol {background-color: #00FFFF} li {background-color: transparent} p {background-color: blue} </style> </head>

    <body>

    <ul> <li>this is ul</li> </ul> <ol> <li>this is ol</li> </ol> <p>This is a paragraph</p>

    </body> </html>

  2. Данный пример показывает, как задать в качестве фона изображение.

    <html> <head>

    <style type="text/css"> body { background-image: url(http://www.intuit.ru/departament/picture.jpg) } </style>

    </head>

    <body> В документе в качестве фона использовано изображение </body>

    </html>

  3. Данный пример показывает, как использовать повторяющееся фоновое изображение.

    <html> <head>

    <style type="text/css"> body { background-image: url(http://www.intuit.ru/departament/picture.jpg); background-repeat: repeat } </style>

    </head>

    <body> В документе в качестве фона использовано повторяющееся изображение </body> </html>

  4. Данный пример показывает, как использовать повторяющееся только по вертикали фоновое изображение.

    <html> <head>

    <style type="text/css"> body { background-image: url(http://www.intuit.ru/departament/picture.jpg); background-repeat: repeat-y } </style>

    </head>

    <body> В документе в качестве фона использовано повторяющееся изображение, которое размножается только вертикально </body> </html>

  5. Данный пример показывает, как использовать повторяющееся только по горизонтали фоновое изображение.

    <html> <head>

    <style type="text/css"> body { background-image: url(http://www.intuit.ru/departament/picture.jpg); background-repeat: repeat-x } </style>

    </head>

    <body> В документе в качестве фона использовано повторяющееся изображение, которое размножается только горизонтально. </body> </html>




    Начало    Вперед