Изучаем HTML, о котором все забыли. Теги. Оформление постов. Ответы на вопросы.
Самое популярное сообщение на лиру, которое набрало больше 10 тысяч цитат, посвящено кодам html. Всё в нем хорошо, да вот только объяснений мало. А ведь с сопроводительной информацией объем можно было бы уменьшить, рассказав какие параметры за что отвечают.
Писать про абсолютно все теги, которые можно использовать - бессмысленно: не хватит места, времени и желания. И, главное, мало кому нужно абсолютно всё.
Ну что же, поехали. Пост написан LexIncorp. Цитировать и ссылаться не запрещено.
Не отрицая возможности возникновения вопросов, предлагаю следующее. Благо, нововведения лиру это позволяют.
Вы оставляете вопрос в комментарии, ставите галочку "Опубликовать комментарий и ссылку в моем дневнике", ваш вопрос дублируется у вас в блоге. У меня появляется время, я иду к вам и отвечаю у вас на поставленный вопрос по теме поста.
Для чего это? Чтобы не загромождать комментарии тут и чтобы ответы на ваши вопросы были у вас).
Прежде чем начать изучение материала, кое-что поясню. Чтобы зайти с улицы в комнату, сначала надо зайти в квартиру, а потом уже в комнату. Также, чтобы выйти на улицу из комнаты, сначала мы выходим из нее, потом из квартиры.
К чему это я? К тому, что первым делом надо закрывать тот тег, который открыли последним. (исключение составляет тег ката).
И еще: не бойтесь экспереминтировать. Html не может убить ваш компьютер и стереть информацию) читаем, изучаем, практикуем
<img src="АДРЕС КАРТИНКИ С РАДИКАЛА СТРОКА №1"title="ВАШ ТЕКСТ">
При наведении на картинку появляется Окошко-подсказка
TITLE - Определяет заголовок картинки, т.е. при наведении на картинку высветится надпись с текстом из атрибута title
Картинка кликабельна и появляется Окошко-Подсказка
Что еще за border="0" спросите Вы, а дело в том, что когда делаешь изображение ссылкой, вокруг него появляется некрасивая рамка(border) и чтобы ее убрать пишут дополнительный атрибут border .
HSPACE и VSPACE - отступы в пикселях по горизонтали и по вертикали от картинки до других обьектов документа. Легко запомнить название если взять и просто перевести с английского.
HSPACE - Horizontal Space - горизонтальный отступ и
VSPACE - Vertical Space - вертикальный отступ.
Эти значения можете изменять .
Картинка с отступами и выравниванием по левому краю
Атрибут align="left" - значит с лева
Атрибут align="justify" - значит выравнивать
HSPACE и VSPACE - отступы в пикселях по горизонтали и по вертикали от картинки до других обьектов документа. Легко запомнить название если взять и просто перевести с английского.
HSPACE - Horizontal Space - горизонтальный отступ и
VSPACE - Vertical Space - вертикальный отступ.
Эти значения можете изменять .
Картинка с отступами и выравниванием по правому краю
Атрибут 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" - значит середина
Стихи писать я не умею,
Но мысли изложить могу…
Я просто от тебя балдею
И не во сне, а наяву.
… Десяток тополей качают стан,
чаруя городок провинциальный.
Осенний парк, с площадкой танцевальной,
роняет листья в выцветший фонтан.
На площади, какой то музыкант,
играл на скрипке полонез забытый,
Да так, что дождь холодный и сердитый,
Почти притих, признав его талант.
Прохожие поднявшие зонты
толпились, подступали ближе робко.
Бросали пятаки ему в коробку,
благодаря за звуки красоты.
И таял город в свете фонарей,
Под звуками мелодии пьянящей
И плыл мотив по тишине звенящей,
И стали все от музыки добрей…
<fieldset><legend><img src="АДРЕС КАРТИНКИ СТРОКА С РАДИКАЛА №1"></legend>ВАША КАРТИНКА</fieldset>
Рамка с разрывом Картинки
<fieldset><legend>Запись в разрыве</legend>Основная запись</fieldset>
Рамка с разрывом Текста
Таблица в 2 ряда и 2 столбца
СМАЙЛИК
СМАЙЛИК
TABLE - Элемент для создания html таблицы. Обязательно должен иметь начальный и конечный теги.
TR (Table Row) - Создает новый ряд таблицы. Закрывающий тег обязателен.
TD (Table Data) - Начинает и заканчивает каждую ячейку ряда html таблицы. Обязателен закрывающий тег.
Т.е. таблица начинается с <table>, затем идёт <tr>, указывающий на начало нового ряда. В ряду вставлены две ячейки: <td>Ряд 1 Ячейка1</td> и <td>Ряд1 Ячейка2</td>. Ряд закрывается </tr>, и сразу начинается новый ряд <tr>. В новом ряду также две ячейки. Таблица закрывается </table>. Все довольно логично
Атрибут BORDER - задает толщину рамки таблицы в пикселах.
Объединяем верхнии ячейки
ШПАРГАЛОЧКИ
Используя эту Формулу можно строить и другие таблицы
ALIGN – определяет способ горизонтального выравнивания html таблицы или содержимого ячеек.
Возможные значения: left , center , right . Значение по умолчанию – left .
Добавляем атрибут cellspacing и так же таблица по центру
Ряд 1 Ячейка1
Ряд1 Ячейка2
Ряд 2 Ячейка 1
Ряд 2 Ячейка 2
CELLSPACING – определяет расстояние (в пикселах) между границами соседних ячеек таблицы html.
WIDTH – определяет ширину таблицы html. Ширина задается либо в пикселах, либо в процентном отношении к ширине окна браузера. По умолчанию этот атрибут определяется автоматически в зависимости от объема содержащегося в таблице материала.
HEIGHT – определяет высоту таблицы. Высота задается либо в пикселах, либо в процентном отношении к высоте окна браузера. По умолчанию этот атрибут определяется автоматически в зависимости от объема содержащегося в html таблице материала.
Так же можно изменить цвет таблицы - Фон
Ряд 1 Ячейка 1
Ряд 1 Ячейка 2
Ряд 2 Ячейка 1
Ряд 2 Ячейка 2
Ряд 1 Ячейка 1
Ряд 1 Ячейка 2
Ряд 2 Ячейка 1
Ряд 2 Ячейка 2
Если картинка большая , то будет отображаться та её часть , которая влезет . Как вы могли уже заметить у меня фон таблицы просто белый .
Делаем бегущую строку не мучаясь с кодами. К примеру, вот такую:
Производим бегущую строку с помощью этого гениратора:
Думаю, вы легко разберётесь как им пользоваться. Единственое - слишком мало предложено цветов фона...
Но и это поправимо. Вы найдёте отличный генератор подбора цвета в этом посту и сможете вставить полученный код после слова bgcolor.
Для удобства Вы можете скопировать себе этот баннер (баннер, с его кодом ниже), и установить себе на страничку, чтобы в любой момент можно было, нажав, на кнопочку, попасть к генератору бегущей строки.
Слайд-шоу - очень простой и эффектный способ поразить собеседника наповал подборкой красивых фотографий. Вот, например, галерея из 20 фотографий природы - устоять невозможно! Когда досмотрите до конца, я вам расскажу как легко сделать подобное и вам самим.
- это простой код подобного слайд-шоу.
Предлагаю вот такое оформление Текста для ваших постов.
Этим текстом можно оформить ЭПИГРАФ дневника.
Копируйте нужный вам код и вставляйте к себе в дневник.
Только в коде вместо слов ВАШ ТЕКСТ пишите свой.
ЛиРу - как сделать бегущую строку ( плюс дополнение к "html для начинающих")
ЛиРу - как сделать бегущую строку ( плюс дополнение к "html" для начинающих)
Как говорится,- меня попросили,- вот и пишу:-)
Не совсем в "тему" т.к. про html- это еще рано. Но пусть будет, т.к. сие можно использовать на нашем любимом лиру:-)
В посте будут написаны не все "параметры" и "нужности", а только необходимый минимум. Остальное мы рассмотрим позже в теме про html.
Поехали:-)
Есть такой специальный тег "marquee", который и поможет вам сделать бегущую строку. Изначально он работал только в браузере Internet Explorer, но теперь почти во всех браузерах.
Лично я проверил,- не работает только в Google Chrome, а в Mozilla Firefox иногда зависает,- надо просто обновить страничку и все заработает:-) А в Opera и Internet Explorer,- работает без проблем:-) Так что имейте это в виду.
Сразу оговорюсь, бегущей строкой может быть не только текст, но и картинка, ссылка например. Покажу наглядно:-)
Вот допустим две картинки:
Применяя этот "код",- вот что получим:
Это не учебник по HTML и даже не пособие. Это ответы на вопросы для таких же чайников как я сама. По чистой случайности мой чайник оказался немного продвинутее. При тщательном изучении оного выяснились некоторые особенности его конструкции. Он имеет встроеные плато «здоровое любопытство» и «высокая самообучаемость». Все новые изыскания и особенности строения моего личного «чайника» будут незамедлительно обнародованы.
(третья редакция. переработанная и дополненная.)
Почти все ответы были собраны на различных сайтах, которые я откопала путешествуя по сети, взяты из учебника по информатики моей дочери и адаптированы специально для блогов. Претензии принимаются, рассматриваются и разбираются. Результаты по ним будут выданы отдельным постом, когда появиться в этом надобность.
Это не учебник по HTML и даже не пособие. Это ответы на вопросы для таких же чайников как я сама. По чистой случайности мой чайник оказался немного продвинутее. При тщательном изучении оного выяснились некоторые особенности его конструкции. Он имеет встроеные плато «здоровое любопытство» и «высокая самообучаемость». Все новые изыскания и особенности строения моего личного «чайника» будут незамедлительно обнародованы.
(третья редакция. переработанная и дополненная.)
Почти все ответы были собраны на различных сайтах, которые я откопала путешествуя по сети, взяты из учебника по информатики моей дочери и адаптированы специально для блогов. Претензии принимаются, рассматриваются и разбираются. Результаты по ним будут выданы отдельным постом, когда появиться в этом надобность.
РАМКИ для ВАС
HSPACE и VSPACE - отступы в пикселях по горизонтали и по вертикали от картинки до других обьектов документа. Легко запомнить название если взять и просто перевести с английского.
Первая часть пишется -- перед кодом , Вторая -- после .
Это не учебник по HTML и даже не пособие. Это ответы на вопросы для таких же чайников как я сама. По чистой случайности мой чайник оказался немного продвинутее. При тщательном изучении оного выяснились некоторые особенности его конструкции. Он имеет встроеные плато «здоровое любопытство» и «высокая самообучаемость». Все новые изыскания и особенности строения моего личного «чайника» будут незамедлительно обнародованы.