П84 html, JavaScript, php и Mysql. Джентльменский набор Web-мастера


align="center">Название документа



бет17/30
Дата11.10.2023
өлшемі6.95 Mb.
#480343
1   ...   13   14   15   16   17   18   19   20   ...   30
Прохоренок Н.А. HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера (3-е издание, 2010) (1)

align="center">Название документа



Оглавление




align="center">Название документа



Подсказка

Глава 1
Глава 2




Пример формы регистрации сайта




Логин:



Пароль:


URL-адрес сайта:



Название сайта:



Описание сайта:



Тема сайта:



Баннер 88*31:







Пример формы регистрации пользователя










Муж.
Жен.



_и_._Группировка_э">









150px;">



Элемент DIV занимает всю ширину родительского элемента

С помощью элемента SPAN можно отформатировать
фрагмент
внутри абзаца



Альтернативный текст
Символ амперсанд внутри ссылки должен заменяться на HTML-
эквивалент.

Текст ссылки

























>Текст1
Красный текст -->
Текст2
Зеленый текст -->
>Текст3
Синий текст -->

>Текст4
Цвет по умолчанию -->

>Текст5
Красный текст -->

>Текст1
Красный текст -->
Текст2
Зеленый текст -->
>Текст3
Синий текст -->

>Текст4
Цвет по умолчанию -->

>Текст5
Красный текст -->


Courier New, serif"> green"> color="yellow">Текст1


Courier New, serif"> green">Текст2

Courier New, serif"> 0; margin-right: 0; margin-top: 0;
margin-bottom: 0">
Или так:
body { margin-left: 0; margin-right: 0; margin-top: 0; margin-bottom: 0 } С помощью атрибута margin можно задать все внешние отступы за один раз: margin:
Например:
body { margin: 15mm 5% 20px 0 }
Для совпадающих значений допускается и более короткая запись:
body { margin: 0 }
      1. Внутренние отступы


С помощью атрибутов padding-left, padding-right, padding-top и padding-bottom можно задать отступы от элемента Web-страницы до его рамки (если она есть). Например, ими задается расстояние между текстом и рамкой ячейки таблицы. Может быть задано абсолютное или относительное значение:

  • padding-left — отступ слева:

td { padding-left: 0 }

  • padding-right — отступ справа:

td { padding-right: 50px }



  • padding-top — отступ сверху:

td { padding-top: 15mm }

  • padding-bottom — отступ снизу:

td { padding-bottom: 20px }
С помощью атрибута padding можно задать все внутренние отступы за один раз:
padding:
Например:
td { padding: 15mm 50px 20px 0 }
Совпадающие отступы можно задать и короче:
td { padding: 5px }
    1. Рамки


Как вы уже знаете, любой элемент Web-страницы занимает в окне Web- браузера некоторую прямоугольную область. Содержимое этой области мо- жет быть окружено рамками. Иными словами, рамки могут иметь не только таблицы, но и любые элементы Web-страницы, например, абзацы.


      1. Стиль линии рамки


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




  • inset — весь блок элемента отображается, как будто он вдавлен в лист;

  • outset — весь блок элемента отображается, как будто он выдавлен из листа.

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



HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">


Тип рамки














Заголовок таблицы
1 2
3 4




Текст в пунктирной рамке

:

эквивалентно заданию стиля a:link { color: #000000 } a:visited { color: #000080 } a:active { color: #FF0000 }
С помощью псевдостилей можно менять не только цвет ссылки, но и задать, будет ли ссылка подчеркнута:
a:link { color: red; text-decoration: underline } a:visited { color: blue; text-decoration: underline } a:active { color: green; text-decoration: none } a:hover { color: lime; text-decoration: none }

Кроме того, можно применить стиль гиперссылок не только ко всему доку- менту, но и к определенному классу:


a.link1:link { color: black; text-decoration: none } a.link1:visited { color: blue; text-decoration: none } a.link1:active { color: red; text-decoration: underline } a.link1:hover { color: red; text-decoration: underline }
В листинге 2.7 продемонстрирована возможность задания внешнего вида ги- перссылок для всего документа, а также для определенного класса.



HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">


Псевдостили гиперссылок






Ссылка1

Ссылка2



Достарыңызбен бөлісу:
1   ...   13   14   15   16   17   18   19   20   ...   30




©dereksiz.org 2024
әкімшілігінің қараңыз

    Басты бет