Главная Мой профиль Регистрация Выход Вход


Приветствую Вас Гость | RSS
Суббота
20.04.2024
13:13



Элитный парфюм

Компания Essens! Брендовая парфюмерия по доступным ценам. Купите свой любимый аромат, не переплачивая за брендовое имя!


Стань партнёром компании Essens! Будь первым в своём городе!

Меню сайта
Категории раздела
Мой Мир [38]
Одноклассники [3]
ВКонтакте [2]
В Мир Тесен [1]
В Кругу Друзей [1]
В Facebook [1]
Антивирус [5]
Безопасность [16]
Браузер [9]
Файлы / Папки [12]
Файлообменники [12]
Программы [33]
Самоучители [5]
Музыка [4]
Windows [30]
Word [2]
Skype [13]
ICQ [1]
Youtube [12]
µTorrent [2]
Дельные советы [26]
Создание сайтов [2]
Эл. кошелёк [1]
XTML-ка [26]
Словарь терминов [2]
Поиск в интернете [2]
Создание закладок [2]
Виртуальный этикет [4]
Шпион [3]
Фри-ланс [5]
Веб мастеру
  • Супер партнёрка
  • Отличный доход с directadvert
  • Оплот стабильного конверта
  • Отличный доход с turbobit
  • Полезные советы






    		•
    Главная » Статьи » Чайников нет » XTML-ка
    HTML-Шпаргалочка
    Огромная HTML-Шпаргалочка
    Пример Код
    <img src="АДРЕС КАРТИНКИ С РАДИКАЛА СТРОКА №1"title="ВАШ ТЕКСТ">
    При наведении на картинку появляется Окошко-подсказка TITLE - Определяет заголовок картинки, т.е. при наведении на картинку высветится надпись с текстом из атрибута title
    <a href="ВАША ССЫЛКА"> <img src="АДРЕС КАРТИНКИ СТРОКА С РАДИКАЛА №1"title="ВАШ ТЕКСТ" border="0" ></a>
    Картинка кликабельна и появляется Окошко-Подсказка Что еще за border="0" спросите Вы, а дело в том, что когда делаешь изображение ссылкой, вокруг него появляется некрасивая рамка(border) и чтобы ее убрать пишут дополнительный атрибут border .

    HSPACE и VSPACE - отступы в пикселях по горизонтали и по вертикали от картинки до других обьектов документа. Легко запомнить название если взять и просто перевести с английского. HSPACE - Horizontal Space - горизонтальный отступ и VSPACE - Vertical Space - вертикальный отступ. Эти значения можете изменять .

    <p align="justify"> <img src="АДРЕС КАРТИНКИ С РАДИКАЛА СТРОКА №1"hspace="15" vspace="15" align="left">ВАШ ТЕКСТ</p> Картинка с отступами и выравниванием по левому краю Атрибут align="left" - значит с лева Атрибут align="justify" - значит выравнивать

    HSPACE и VSPACE - отступы в пикселях по горизонтали и по вертикали от картинки до других обьектов документа. Легко запомнить название если взять и просто перевести с английского. HSPACE - Horizontal Space - горизонтальный отступ и VSPACE - Vertical Space - вертикальный отступ. Эти значения можете изменять .

    <p align="justify"> <img src="АДРЕС КАРТИНКИ С РАДИКАЛА СТРОКА №1" hspace="15" vspace="15" align="right">ВАШ ТЕКСТ</p>
    Картинка с отступами и выравниванием по правому краю Атрибут align="right" - значит с права Атрибут align="justify" - значит выравнивать

    Жаль, что мы не рисуем прямо глазами. Как много пропадает на длинном пути от глаз через руку к кисти. /Г. Лессинг/ Произведение, которое читают, имеет настоящее. Произведение, которое перечитывают, имеет будущее. /А. Дюма-сын/

    <p align="justify"><img src="АДРЕС КАРТИНКИ С РАДИКАЛА СТРОКА №1" align="left">ВАШ ТЕКСТ</p>
    Картинка без отступов , с выравниванием по левому краю Если поменять атрибут align="left" на align="right" - то получите Картинку без отступов , с выравниванием по правому краю .
    Обратите внимание , что ваш текст должен быть поделен на две части Первая часть пишется -- перед кодом , Вторая -- после .
    Первая часть текста <img src="АДРЕС КАРТИНКИ СТРОКА С РАДИКАЛА №1" align="middle" border="0"> Вторая часть текста
    Картинка в середине Текста Атрибут align="middle" - значит середина
     Стихи писать я не умею, Но мысли изложить могу…  Я просто от тебя балдею     И не во сне, а наяву.
    <table align=center border=0> <tr> <td><img src="АДРЕС КАРТИНКИ СТРОКА С РАДИКАЛА №1"></td> <td>ТЕКСТ</td> <td><img src="АДРЕС КАРТИНКИ СТРОКА С РАДИКАЛА №1"></td> </tr> </table>
    Текст между двух картинок
    … Десяток тополей качают стан, чаруя городок провинциальный. Осенний парк, с площадкой танцевальной, роняет листья в выцветший фонтан. На площади, какой то музыкант, играл на скрипке полонез забытый, Да так, что дождь холодный и сердитый, Почти притих, признав его талант. Прохожие поднявшие зонты толпились, подступали ближе робко. Бросали пятаки ему в коробку, благодаря за звуки красоты. И таял город в свете фонарей, Под звуками мелодии пьянящей И плыл мотив по тишине звенящей, И стали все от музыки добрей…
    <table align=center border=0> <tr> <td>ТЕКСТ</td> <td><img src="АДРЕС КАРТИНКИ СТРОКА С РАДИКАЛА №1"></td> <td>ТЕКСТ</td> </tr> </table>
    Картинка между текстом
    Рамка растягивается на всю ширину записи .
    <fieldset><legend><img src="АДРЕС КАРТИНКИ СТРОКА С РАДИКАЛА №1"></legend>ВАША КАРТИНКА</fieldset>
    Рамка с разрывом Картинки
    Добро ПожаловатьРада Вас приветствовать у себя в Блоге
    <fieldset><legend>Запись в разрыве</legend>Основная запись</fieldset>
    Рамка с разрывом Текста
    Таблица в 2 ряда и 2 столбца
    СМАЙЛИК
    СМАЙЛИК
    TABLE - Элемент для создания html таблицы. Обязательно должен иметь начальный и конечный теги. TR (Table Row) - Создает новый ряд таблицы. Закрывающий тег обязателен. TD (Table Data) - Начинает и заканчивает каждую ячейку ряда html таблицы. Обязателен закрывающий тег.
    <table border="1"> <tr> <td>Ряд 1 Ячейка1</td> <td>Ряд1 Ячейка2</td> </tr> <tr> <td>Ряд 2 Ячейка 1</td> <td>Ряд 2 Ячейка 2</td> </tr> </table>
    Т.е. таблица начинается с <table>, затем идёт <tr>, указывающий на начало нового ряда. В ряду вставлены две ячейки: <td>Ряд 1 Ячейка1</td> и <td>Ряд1 Ячейка2</td>. Ряд закрывается </tr>, и сразу начинается новый ряд <tr>. В новом ряду также две ячейки. Таблица закрывается </table>. Все довольно логично Атрибут BORDER - задает толщину рамки таблицы в пикселах.
    Объединяем верхнии ячейки
    ШПАРГАЛОЧКИ
         
    Используя эту Формулу можно строить и другие таблицы
    Ряд 2 Ячейка 1 Ряд 2 Ячейка 2 Ряд 2 Ячейка 3
    <table border="1"> <tr> <td colspan="2">Ряд 1 Ячейки 1+2</td> </tr> <tr> <td>Ряд 2 Ячейка 1</td> <td>Ряд 2 Ячейка 2</td> </tr> </table>
    COLSPAN – определяет количество столбцов , на которые простирается данная ячейка. По умолчанию имеет значение 1.
    Объединяем ячейки слева
    Ячейка 1, Ряд 1+2 Ряд1 Ячейка2
    Ряд 2 Ячейка 2
    Ячейка 1 Ряд 1+2+3+4 Ряд1 Ячейка2
    Ряд 2 Ячейка 2
    Ряд 3 Ячейка 2
    Ряд 4 Ячейка 2
    <table border="1"> <tr> <td rowspan="2">Ячейка 1, Ряд 1+2</td> <td>Ряд1 Ячейка2</td> </tr> <tr> <td>Ряд 2 Ячейка 2</td> </tr> </table>
    ROWSPAN – определяет количество рядов , на которые простирается данная ячейка. По умолчанию имеет значение 1.
    Добавляем атрибут cellpadding и выравниваем таблицу по центру
    Ряд 1 Ячейка1Ряд1 Ячейка2
    Ряд 2 Ячейка 1 Ряд 2 Ячейка 2
    CELLPADDING – определяет расстояние (в пикселах) между рамкой каждой ячейки html таблицы и содержащемся в ней материалом.
    <table border="4" align="center" cellpadding="10"> <tr> <td>Ряд 1 Ячейка1</td><td>Ряд1 Ячейка2</td> </tr> <tr> <td>Ряд 2 Ячейка 1</td> <td>Ряд 2 Ячейка 2</td> </tr> </table>
    ALIGN – определяет способ горизонтального выравнивания html таблицы или содержимого ячеек. Возможные значения: left , center , right . Значение по умолчанию – left .
    Добавляем атрибут cellspacing и так же таблица по центру
    Ряд 1 Ячейка1Ряд1 Ячейка2
    Ряд 2 Ячейка 1 Ряд 2 Ячейка 2
    CELLSPACING – определяет расстояние (в пикселах) между границами соседних ячеек таблицы html.
    <table border="1" align="center" cellspacing="10"> <tr> <td>Ряд 1 Ячейка1</td><td>Ряд1 Ячейка2</td> </tr> <tr> <td>Ряд 2 Ячейка 1</td> <td>Ряд 2 Ячейка 2</td> </tr> </table>
    Если необходимо , можно задать ширину и высоту таблицы Так же таблица расположена по центру
    Ряд 1 Ячейка1Ряд1 Ячейка2
    Ряд 2 Ячейка 1 Ряд 2 Ячейка 2
    <table border="1" align="center" width="400" height="100"> <tr> <td>ряд 1 ячейка1</td><td>ряд1 ячейка2</td> </tr> <tr> <td>ряд 2 ячейка 1</td> <td>ряд 2 ячейка 2</td> </tr> </table>
    WIDTH – определяет ширину таблицы html. Ширина задается либо в пикселах, либо в процентном отношении к ширине окна браузера. По умолчанию этот атрибут определяется автоматически в зависимости от объема содержащегося в таблице материала. HEIGHT – определяет высоту таблицы. Высота задается либо в пикселах, либо в процентном отношении к высоте окна браузера. По умолчанию этот атрибут определяется автоматически в зависимости от объема содержащегося в html таблице материала.
    Так же можно изменить цвет таблицы - Фон
    Ряд 1 Ячейка 1 Ряд 1 Ячейка 2
    Ряд 2 Ячейка 1 Ряд 2 Ячейка 2
    Ряд 1 Ячейка 1 Ряд 1 Ячейка 2
    Ряд 2 Ячейка 1 Ряд 2 Ячейка 2
    Если картинка большая , то будет отображаться та её часть , которая влезет . Как вы могли уже заметить у меня фон таблицы просто белый .
    <table background="АДРЕС ФОНА СТРОКА С РАДИКАЛА №1" border=2 align="center" > <tr> <td>Ряд 1 Ячейка 1</td> <td>Ряд 1 Ячейка 2</td> </tr> <tr> <td>Ряд 2 Ячейка 1</td> <td>Ряд 2 Ячейка 2</td> </tr> </table>
    BACKGROUND – позволяет заполнить фон таблицы рисунком. В качестве значения необходимо указать URL рисунка.
    Нумерованный список
      НАЗВАНИЕ СПИСКА
    1. Строка
    2. Строка
    3. Строка
    Цвет определяете сами
    <OL>НАЗВАНИЕ СПИСКА <LI>Строка <LI>Строка <LI>Строка </OL>
    Нумерованный список определяется - метками <OL></OL>. Элементы списка отмечаются метками <LI>. В нумерованном списке элементы нумерует сам браузер. Заметим, метка <LI> непарная - т.е. метки </LI> не существует.
    Ненумерованный список
      НАЗВАНИЕ СПИСКА
      Строка 1
      Строка 2
      Строка 3
      Строка 4
    Ненумерованный список определяется метками <UL></UL>
    		<UL> <B>НАЗВАНИЕ СПИСКА</B><BR> <IMG SRC="http://img90.imageshack.us/img90/6603/33609040px4.gif">Строка 1<BR> <IMG SRC="http://img90.imageshack.us/img90/6603/33609040px4.gif">Строка 2<BR> <IMG SRC="http://img90.imageshack.us/img90/6603/33609040px4.gif">Строка 3<BR> <IMG SRC="http://img90.imageshack.us/img90/6603/33609040px4.gif">Строка 4<BR> </UL>
    Вот пример ещё ненумерованного списка
      НАЗВАНИЕ СПИСКА
      Строка 1
      Строка 2
      Строка 3
      Строка 4
    		 <UL> <B>НАЗВАНИЕ СПИСКА</B><BR> <IMG SRC="http://www.liveinternet.ru/images/brandnewsmilies/heart.gif">Строка 1<BR> <IMG SRC="http://www.liveinternet.ru/images/brandnewsmilies/heart.gif">Строка 2<BR> <IMG SRC="http://www.liveinternet.ru/images/brandnewsmilies/heart.gif">Строка 3<BR> <IMG SRC="http://www.liveinternet.ru/images/brandnewsmilies/heart.gif">Строка 4<BR> </UL>
    Вот пример ещё ненумерованного списка
      НАЗВАНИЕ СПИСКА
      Строка 1
      Строка 2
      Строка 3
      Строка 4
    		 <UL> <B>НАЗВАНИЕ СПИСКА</B><BR> <IMG SRC="http://img.mail.ru/r/blogs/ico_friends.png">Строка 1<BR> <IMG SRC="http://img.mail.ru/r/blogs/ico_friends.png">Строка 2<BR> <IMG SRC="http://img.mail.ru/r/blogs/ico_friends.png">Строка 3<BR> <IMG SRC="http://img.mail.ru/r/blogs/ico_friends.png">Строка 4<BR> </UL>
    Вот пример ещё ненумерованного списка
      НАЗВАНИЕ СПИСКА
      Строка 1
      Строка 2
      Строка 3
      Строка 4
    		 <UL> <B>НАЗВАНИЕ СПИСКА</B><BR> <IMG SRC="http://img15.imageshack.us/img15/7746/star0000.gif">Строка 1<BR> <IMG SRC="http://img15.imageshack.us/img15/7746/star0000.gif">Строка 2<BR> <IMG SRC="http://img15.imageshack.us/img15/7746/star0000.gif">Строка 3<BR> <IMG SRC="http://img15.imageshack.us/img15/7746/star0000.gif">Строка 4<BR> </UL>
    Пример простого ненумерованного списка
      Название Списка
    • Строка 1
    • Строка 2
    • Строка 3
    <UL>Название Списка <LI>Строка 1 <LI>Строка 2 <LI>Строка 3 </UL>
    Ненумерованный список определяется метками <UL></UL>
      

    Понравилось? Поделитесь ссылкой с друзьями на проекте МОЙ МИР





    Источник: http://blogs.mail.ru/mail/lenysik_rezvix/5CD0820C87DB6FA1.html
    Категория: XTML-ка | Добавил: Милледи (13.06.2010)
    Просмотров: 1645 | Рейтинг: 0.0/0 |
    Всего комментариев: 0
    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]
    Погода в доме

    Яндекс.Погода

    Подпишитесь!

    Хотите первыми узнавать новости сайта - подпишитесь!

    Введите Ваш e-mail:

    Сейчас на сайте
    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0

    Наш баннер



    Друзья сайта

    <text size=


    <text size=


    <text size=


    <text size=


    fleshmagik - Флеш анимации Музыкальные открытки

    Форма входа

    Интересное в сети
  • Официальный блог
  • Сообщество uCoz
  • FAQ по системе
  • Инструкции для uCoz
    		•






     Copyright MyCorp © 2024
    		 


    Рейтинг@Mail.ru тИЦ и PR сайта Яндекс цитирования Мир моих надежд Cкрипты, шаблоны, курсоры, часы и знаменитости. Интернет - посиделки Веб-дизайнеру: картинки, анимашки и многое другое!