HTML/CSS. Справочник. Ссылки на учебники и статьи

**Exilia** · 01.02.2004, 23:29

Автор оригинала Ния
~))VioLLa((~
Лично я сую стиль который меняет цвет полосы прокрутки между боди и хэад..

и делаешь неправильно

все стили суют между тегами <head> и </head>

**Unknown** · 02.02.2004, 00:27

~))VioLLa((~, чего-то, ты дитё моё, нахимичило..
Короче говоря, смотри, что должно быть:
<html>
<--- начало шапки
<head>
<title>new.seria"s"</title>
<--- начало стиля
<style type="text/css">
body {background-image:url('image/ri.jpg')}
a:link {text-decoration:none ;
font-size:13px;
color:black;
font-family: Comic Sans MS}
a:visited {text-decoration:none ;
font-size:13px;
color:black;
font-family: Comic Sans MS}
a:hover {text-decoration:none ;
font-size:13px;
color

urple;
font-family: Comic Sans MS}
body {
scrollbar-face-color: #00FF00;
scrollbar-shadow-color: #0000FF;
scrollbar-highlight-color: #FF0000;
scrollbar-3dlight-color: #FFFF00;
scrollbar-darkshadow-color: #00FFFF;
scrollbar-track-color: #FFFFFF;
scrollbar-arrow-color: #008000;
<--- конец стиля
</style>
<--- конец шапки
</head>
<body>
тело страницы
</body>
</html>
Вот так все работает как положено.

**RuMoHoR** · 03.02.2004, 05:33

Есть замечательная штука - validator.w3.org
Проверяет правильность HTML-а (на соответсвие стандартам).

Рядом живет css-validator - для CSS

Рекомендую.

**Exilia** · 14.02.2004, 19:19

Автор оригинала Дочь Билла Гейтса
два вопроса...
1. как расятнуть все слово (или несколько слов) на всю ширину колонки таблицы? притом, что это ссылка и притом, что я все такие вещи делаю через каскадные таблицы... То есть чего нужно написать в файле ***.css?
2. затем.... у меня таблица из трех колонок в одной строке. В центральной колонке идет текст и он достаточно длинный... Соответсвенно небольшие списки (ссылок) в боковых колонках уходят на середину относительно вертикали. Я убираю это с помощью пустых абзацев: <p> </p>
Есть ли что специальное? Например, через те же каскадные таблицы.... Чтобы каждый раз не ставить эти пустые абзацы....

1. я уже писала тебе помоему....попробуй использовать <ul></ul> - список....лично мне помогало

2.я несовсем тя поняла...зафига ставить <p>? не легчели сразу <br> фигарить? - понимаю - код выглядит не красиво потом...но наверное удобнее...я б сказала как выравнивать с помощью див - но ты просто замучаешься выравнивать

...потому как вы ленивые все и сайты свои месяцами делаете

idolo · 17.08.2004, 00:05

-)) Самый лучший сайт по CSS и HTML это http://w3c.org

bleck_hawk · 16.10.2004, 01:13

Сообщение от Марихуана

Как строить таблицы?

Таблицы.

Рассмотрим построение таблицы на примере:

Пример 1.

Код Отображение
<TABLE WIDTH="50%" BORDER="1" ALIGN="center">
<TR> <TD> Ячейка 1 </TD> <TD> Ячейка 2 </TD> </TR>
<TR> <TD> Ячейка 3 </TD> <TD> Ячейка 4 </TD> </TR>
</TABLE> Ячейка 1 Ячейка 2
Ячейка 3 Ячейка 4

Таблица описывается тегом <TABLE>. Элементы таблицы строятся по рядам (строки). Ряд задается тегом <TR> (Table Row, ряд таблицы). Внутри ряда находятся ячейки (столбцы) (тег <TD> - Table Date, данные таблицы). Для заголовков столбцов вместо тега <TD> используется <TH> (Table Head, заголовок таблицы). Разница в этих тегах лишь в том, что текст в последнем центрируется и выделяется жирным шрифтом.

Рассмотрим свойства тега <TABLE>. Свойство BORDER определяет толщину рамок таблицы. Для создания таблицы без рамок задают BORDER="0". Для определения ширины таблицы используют свойство WIDTH. Значением может быть ширина в пикселях или же в процентах. По умолчанию ширина определяется содержимым ячеек таблицы. Выравнивание таблицы задается свойством ALIGN. Возможные значения: LEFT (по левому краю), CENTER (центрирование), RIGHT (по правому краю).

Рассмотрим свойства оформления тега <TABLE>. Свойство BORDERCOLOR задает цвет окантовки, BGCOLOR и BACKGROUND цвет фона и фоновое изображение, соответственно. Два последних тега применимы также для целого ряда таблицы или же для отдельной ячейки. Создадим таблицу с зелеными рамками и желтым фоном:

Пример 2.

Код Отображение
<TABLE BORDER="1" BORDERCOLOR="green" BGCOLOR="yellow">
<TR> <TD> Ячейка 1 </TD> <TD> Ячейка 2 </TD> </TR>
</TABLE> Ячейка 1 Ячейка 2

Свойство FRAME задает то, какие линии внешней рамки будут отображены. Возможные значения: VOID (избегать) - окантовка отсутствует, ABOVE (сверху), BELOW (снизу), HSIDES (Horisontal Sides - горизонтальные стороны), VSIDES (Vertical Sides - вертикальные стороны), LHS (Left Hand Sides - слева), RHS (Right Hand Side - справа), BOX или BORDER - вся окантовка (значение по умолчанию).

Пример 3.

Код Отображение
<TABLE BORDER="1" FRAME="HSIDES">
<TR> <TD> Ячейка 1 </TD> <TD> Ячейка 2 </TD> </TR>
</TABLE> Ячейка 1 Ячейка 2

Свойство RULES определяет стиль рисования линий между ячейками таблицы. Возможные значения: NONE - нет линий, ROWS - между рядами, COLS - между колонками, ALL - рисуются все линии (значение по умолчанию).

Пример 4.

Код Отображение
<TABLE BORDER="1" RULES="NONE">
<TR> <TD> Ячейка 1 </TD> <TD> Ячейка 2 </TD> </TR>
<TR> <TD> Ячейка 3 </TD> <TD> Ячейка 4 </TD> </TR>
</TABLE> Ячейка 1 Ячейка 2
Ячейка 3 Ячейка 4

<TABLE BORDER="1" RULES="ROWS">
<TR> <TD> Ячейка 1 </TD> <TD> Ячейка 2 </TD> </TR>
<TR> <TD> Ячейка 3 </TD> <TD> Ячейка 4 </TD> </TR>
</TABLE> Ячейка 1 Ячейка 2
Ячейка 3 Ячейка 4

Свойства CELLSPACING и CELLPADDING задает расстояние между ячейками и между рамкой ячейки и ее содержимым, соответственно:

Пример 5.

Код Отображение
<TABLE BORDER="1" CELLSPACING="5" CELLPADDING="10">
<TR> <TD> Ячейка 1 </TD> <TD> Ячейка 2 </TD> </TR>
</TABLE> Ячейка 1 Ячейка 2

Свойства ALIGN и VALIGN применимы для строк и ячеек для горизонтального и вертикального выравнивания текста, соответственно. Значения ALIGN: LEFT (по левому краю), CENTER (центрирование), RIGHT (по правому краю). Свойство VALIGN может принимать значения: TOP - по верхнему краю, CENTER - по центру, BOTTOM - по нижнему краю.

Свойства COLSPAN и ROWSPAN объединяют указанное значение столбцов и строк соответственно:

Пример 6.

Код Отображение
<TABLE BORDER="1">
<TR> <TD> Ячейка 1 </TD> <TD> Ячейка 2 </TD> </TR>
<TR> <TD COLSPAN="2"> Большая ячейка 3 </TD> </TR>
</TABLE> Ячейка 1 Ячейка 2
Большая ячейка 3

Позиционирование таблицами.

При создании дизайна сайта прежде всего необходимо продумать где какие элементы страницы будут размещены. Неоценимую помощь в этом могут оказать таблицы. Ваша страница будет представлять собой таблицу с элементами сайта в ее ячейках (можно делать невидимые границы). При написании сайта под определенное разрешение экрана (обычно 800х600) можно просто задать ширину страницы (немного меньшее, чем само разрешение экрана, чтобы вмешалась полоска вертикального скроллинга). Выравнивание по центру или по левому краю (но не по правому!) приведет к тому, что страница будет выглядеть хорошо при любом другом разрешении экрана. Как проверить соответствует ли страница разрешению 800x600? Переключите монитор на это разрешение и разверните страницу, открытую в браузере, на полный экран. Полосы горизонтального скроллинга не должно быть!

а еще подпришись в Subscribe.Ru на рассылку "Уроки веб-дизайна с подробными примерами" там много интересного( если хоче ).

**Паренек** · 08.04.2005, 13:27

Для начала почитай какие-нибудь html учебники... (уч.1)...

Psionic Vision · 09.04.2005, 04:39

Открываешь блокнот. Пишешь "Hello World". Сохраняешь в формате .htm
Запускаешь. Сайт готов =)

**Паренек** · 09.04.2005, 14:24

Ну уж если начинать, то хотя бы с кода

Код:

<html><head>
<title>мой сайт</title>
<body color=white>
</head>
My page
</body></html>

Psionic Vision · 09.04.2005, 17:34

Паренек,
код уже неправильный

не соответсвует даже стандарту HTML 4.01, я не говорю уже о XHTML 1.0 Transitional...

Во-первых, где doctype?
Во-вторых, не color=white, а color="white"
В-третьих, у тебя пересекаются теги body и title.
Более правильный код:

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<title>мой сайт</title>
</head>

<body color="white">
My page
</body>

</html>

Psionic Vision · 09.04.2005, 19:18

Lika

Тоже верно. Но я знаю некоторых, которые вроде любят программирование, а к dreamweaver-у привыкли настолько что в обычном блокноте редактировать боятся...

А учиться с хорошо написанных учебников гораздо интересней.

Вот учебники, в которых даются основы:
http://www.compdoc.ru/internet/html/htmlbook/
http://www.compdoc.ru/internet/html/beghtml/

Если найду учебник o'reilly в электронном виде, дам ссылку

Lika · 09.04.2005, 19:24

Сообщение от Dark Visor

Lika

Если найду учебник o'reilly в электронном виде, дам ссылку

Спасибо.Посмотрю обязательно. Вообще-то у меня учебников куча, но я жадная - чем больше, тем лучше. А вот не встречал ли хороший учебник по РНР? (в интернете, имеется в виду - русские книги в бумажном виде мне здесь трудно достать)

Psionic Vision · 09.04.2005, 19:51

Я тут выяснил, самый новый вариант учебника ХТМЛ - HTML & XHTML: The Definitive Guide, 5th Edition... В розыске.

А насчет PHP - по-моему лучший учебник это тот, что предоставляет сам www.php.net:

http://us3.php.net/get/php_manual_ru...php.net/mirror
http://us3.php.net/get/php_manual_ru...php.net/mirror
http://us3.php.net/get/php_manual_ru...php.net/mirror

Psionic Vision · 09.04.2005, 19:58

Ураа!!
Нашел: http://www.internet-technologies.ru/books/book_17.html
Прямая ссылка на скачку: ftp://ftp.cdut.edu.cn/pub3/uncate_do...%20Edition.chm (связь прерывистая, рекомендую использовать менеджер докачек... 1MB)

Psionic Vision · 09.04.2005, 20:14

Тьфу. А файл-то с HTML & XHTML учебником оказался битым

[ADDED=Dark Visor]1113064051[/ADDED]
Еле вытянул рабочий варинат. Сейчас перепакую и закачаю в более быстрое место. Правда, учебник на английском... Но думаю это ничего.

[ADDED=Dark Visor]1113064559[/ADDED]
Вот, я перепаковал и закачал. Информация:

Скрытый контент. Наслаждайтесь просмотром!

Заходишь на www.programist.ru
Логин: fexchange
Пароль: fexchange

Идешь на вкладку "файлы". Оттуда качаешь Oreilly.HTML.And.XHTML.The.Definitive.Guide.5th.Ed ition.iNT.eBook-LiB.rar
Можешь прихватить еще и
Oreilly.Cascading.Style.Sheets.The.Definitive.Guid e.2nd.Edition.eBook-DDU.rar
Пригодится

Тема: HTML/CSS. Справочник. Ссылки на учебники и статьи

Опции темы

Ваши права