Студопедия

Главная страница Случайная страница

Разделы сайта

АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника






  • Стиль линии рамки






    С помощью атрибутов border-left-style (левая линия), border-right-style (правая линия), border-top-style (верхняя линия) и border-bottom-style (нижняя линия) можно задать тип линии рамки. Могут принимать следующие значения:

    • none — линия не отображается;
    • solid — линия отображается сплошной линией;
    • dotted — пунктирная линия;
    • dashed — штриховая линия;
    • double — линия отображается в виде двойной линии;
    • groove — вдавленная рельефная линия;
    • ridge — выпуклая рельефная линия;
    • inset — весь блок элемента отображается, как будто он вдавлен в лист;
    • outset — весь блок элемента отображается, как будто выдавлен из листа.

    В качестве примера укажем стиль рамки для разных элементов страницы.

    < html>
    < head>
    < meta http-equiv=" Content-Type" content=" text/html; charset=UTF-8" >
    < title> Тип рамки< /title>
    < style type=" text/css" >
    table { border-left-style: dashed; border-right-style: dotted; border-top-style: solid; border-bottom-style: groove }
    td { border-left-style: none; border-right-style: none; border-top-style: none; border-bottom-style: none; text-align: center }
    caption { border-top-style: solid }
    p { border-left-style: dotted; border-right-style: dotted; border-top-style: dotted; border-bottom-style: dotted }
    < /style>
    < /head>

    < body>
    < table width=" 300" align=" center" >
    < caption> Заголовок таблицы < /caption>
    < tr>
    < td> 1< /td>
    < td> 2< /td>
    < /tr>
    < tr>
    < td> 3< /td>
    < td> 4< /td>
    < /tr>
    < /table>
    < p> Текст в пунктирной рамке< /p>
    < /body>
    < /html>

    В окне веб-браузера это будет выглядеть ТАК.

    Этот пример показывает, что указать тип рамки можно не только для границ таблицы, но и для заголовка таблицы, и даже для абзацев.

    Эти атрибуты могут быть объединены в одном атрибуте border-style:

    border-style: < top> < right> < bottom> < left>

    Если все значения совпадают, можно указать это значение один раз:

    table { border-style: dotted }






    © 2023 :: MyLektsii.ru :: Мои Лекции
    Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав.
    Копирование текстов разрешено только с указанием индексируемой ссылки на источник.