-Рубрики

 -Поиск по дневнику

Поиск сообщений в Blagostrofa

 -Подписка по e-mail

 

 -Статистика

Статистика LiveInternet.ru: показано количество хитов и посетителей
Создан: 04.02.2012
Записей: 2068
Комментариев: 16
Написано: 2159





Html для начинающих ( часть 3-ая, цвет фона, фоновая картинка, вставка изображений)

Пятница, 09 Марта 2012 г. 13:44 + в цитатник
Это цитата сообщения Legionary [Прочитать целиком + В свой цитатник или сообщество!]

Html для начинающих ( часть 3-ая, цвет фона, фоновая картинка, вставка изображений)

Html для начинающих ( часть 3-ая, цвет фона, фоновая картинка, вставка изображений)

Продолжаем познавать азы html строительства. Напомню ссылки на предыдущие части:
Первая часть
Вторая часть
Ссылка на рубрику


Теперь будем учиться заливать нашу страничку цветом, фоновой картинкой, а также,- вставлять картинки на странички.

Цвет фона странички

Чтобы указать цвет фона используем наш главный тег body ( о нем говорили во второй части). Ему нужно прописать параметр, отвечающий за цвет. А точнее говоря параметр bgcolor

Этот параметр прописываем так:

bgcolor="цвет"

Т.е. целиком, вместе с тегом body это будет выглядеть так:

<body bgcolor="цвет">

Цвет, как всегда, указываем в его цифровом значении, например "#000000" ( можно и по имени, например "red")

Читать дальше > > >

Серия сообщений "HTML":
Часть 1 - Ищем ссылку! Урок о том, чего лучше не делать, но знать об этом надо
Часть 2 - Чем отличаются BB коды от тегов html?
...
Часть 8 - Html для начинающих ( часть 5-ая, практикуемся)
Часть 9 - Html для начинающих ( часть 4-ая, таблицы, разрешение экрана)
Часть 10 - Html для начинающих ( часть 3-ая, цвет фона, фоновая картинка, вставка изображений)
Часть 11 - ЛиРу - как сделать бегущую строку ( плюс дополнение к html для начинающих)
Часть 12 - Html для начинающих ( часть 2-ая)
Часть 13 - Начинаем изучать html
Часть 14 - Как быстро взять картинку без кода и вставить в нужное место.


Html для начинающих ( часть 4-ая, таблицы, разрешение экрана)

Пятница, 09 Марта 2012 г. 13:44 + в цитатник
Это цитата сообщения Legionary [Прочитать целиком + В свой цитатник или сообщество!]

Html для начинающих ( часть 4-ая, таблицы, разрешение экрана)

Html для начинающих ( часть 4-ая, таблицы)

Пожалуй, одна из важнейших тем по html. Только не пугайтесь, важность не означает сложность:-)
Когда я начинал изучать html долго не мог врубиться че ж такого хорошего в таблицах.. таблички и таблички вроде, ничего особенного...)))
Короче говоря, отсеиваем наше общепринятое понятие этого слова и начинаем изучать:-)

Основная функция таблиц в html, на мой взгляд, это разграничение пространства. Т.е. разделение странички на сектора, участки.

Посмотрите на дизайн нашего ЛиРу :-) Слева столбик и справа столбик чуть пошире. Вот и разграничение пространства) все на своем месте, а не где попало)
Все, думаю основную мысль вы поняли) Теперь идем изучать:-)

Таблица делится на строки и столбики. Соответственно получаются ячейки.
Таблица вставляется в саму страничку, поэтому прописывать ее надо между тегами <body> и </body> ( о том,- что это такое, говорили раньше)

Тег таблицы прописывается так <table> , этот тег требует закрытия, т.е. окончание таблицы обозначаем закрывающим тегом </table>
Просто так таблица быть не может:-) думаю это понятно. В таблице должны быть минимум одна строка и минимум один столбик:-)

Строка обозначается тегами <tr> и </tr>, т.е. открывающий строку тег и закрывающий.

Столбик же обозначается тегами <td> и </td>
Содержимое таблицы ( тексты,картинки и пр.) уже прописывается в столбиках, т.е. между тегами столбиков.

Теперь по-русски:-)
Таблица,в ней строка, в ней столбик.
Самый просто код таблицы получается такой:
<table>
<tr>
<td>Содержимое таблицы</td>
</tr>
</table>

Внимательно следим за последовательностью закрытия тегов! Помните правило, я надеюсь?;-)


Читать дальше > > >

Серия сообщений "HTML":
Часть 1 - Ищем ссылку! Урок о том, чего лучше не делать, но знать об этом надо
Часть 2 - Чем отличаются BB коды от тегов html?
...
Часть 7 - Поля для кодов. Внешний вид и пр.
Часть 8 - Html для начинающих ( часть 5-ая, практикуемся)
Часть 9 - Html для начинающих ( часть 4-ая, таблицы, разрешение экрана)
Часть 10 - Html для начинающих ( часть 3-ая, цвет фона, фоновая картинка, вставка изображений)
Часть 11 - ЛиРу - как сделать бегущую строку ( плюс дополнение к html для начинающих)
Часть 12 - Html для начинающих ( часть 2-ая)
Часть 13 - Начинаем изучать html
Часть 14 - Как быстро взять картинку без кода и вставить в нужное место.


Html для начинающих ( часть 5-ая, практикуемся)

Пятница, 09 Марта 2012 г. 13:43 + в цитатник
Это цитата сообщения Legionary [Прочитать целиком + В свой цитатник или сообщество!]

Html для начинающих ( часть 5-ая, практикуемся)

Html для начинающих ( часть 5-ая, практикуемся)



Продолжаем познавать азы Html :-) Это 5-ая часть нашего обучения, остальные части смотрите ТуТ.
Пора немного попрактиковаться и создать свою первую более менее приличную страничку. Плюс,- узнать еще парочку тегов:-)

Итак, в результате получим примерно такое.

Сначала посмотрим весь "код", а потом разберем его по частям:
<html>
<head>
<title>
Фридрих Ницше. Цитаты</title>
</head>
<body link="red" vlink="red" alink="#ffffff" background="http://legion-blog.narod.ru/yroki/01.jpg" ><center>
<table cellpadding="10" background="http://legion-blog.narod.ru/yroki/1.png" width="800" border="1">
<tr>
<td><center>
Читать дальше > > >

Серия сообщений "HTML":
Часть 1 - Ищем ссылку! Урок о том, чего лучше не делать, но знать об этом надо
Часть 2 - Чем отличаются BB коды от тегов html?
...
Часть 6 - CSS. Border, background. Введение
Часть 7 - Поля для кодов. Внешний вид и пр.
Часть 8 - Html для начинающих ( часть 5-ая, практикуемся)
Часть 9 - Html для начинающих ( часть 4-ая, таблицы, разрешение экрана)
Часть 10 - Html для начинающих ( часть 3-ая, цвет фона, фоновая картинка, вставка изображений)
...
Часть 12 - Html для начинающих ( часть 2-ая)
Часть 13 - Начинаем изучать html
Часть 14 - Как быстро взять картинку без кода и вставить в нужное место.


Поля для кодов. Внешний вид и пр.

Пятница, 09 Марта 2012 г. 13:42 + в цитатник
Это цитата сообщения Legionary [Прочитать целиком + В свой цитатник или сообщество!]

Поля для кодов. Внешний вид и пр.

Такой небольшой, но очень полезный постик:)

Речь пойдет про поля, в которые прописывается некий код, для того, чтобы читатель мог потом этот код с легкостью взять. Коды флешек, картинок, постов и пр. Окошки такие, к примеру:





Такие простенькие окошки. Про первое говорить не будем. Оно как бы не совсем предназначено для этих целей (содержать в себе некий код), а вот про второе,- поговорим.

Пишется оно очень просто:

Читать дальше > > >

Серия сообщений "HTML":
Часть 1 - Ищем ссылку! Урок о том, чего лучше не делать, но знать об этом надо
Часть 2 - Чем отличаются BB коды от тегов html?
...
Часть 5 - Подсказка title
Часть 6 - CSS. Border, background. Введение
Часть 7 - Поля для кодов. Внешний вид и пр.
Часть 8 - Html для начинающих ( часть 5-ая, практикуемся)
Часть 9 - Html для начинающих ( часть 4-ая, таблицы, разрешение экрана)
...
Часть 12 - Html для начинающих ( часть 2-ая)
Часть 13 - Начинаем изучать html
Часть 14 - Как быстро взять картинку без кода и вставить в нужное место.


CSS. Border, background. Введение

Пятница, 09 Марта 2012 г. 13:42 + в цитатник
Это цитата сообщения Legionary [Прочитать целиком + В свой цитатник или сообщество!]

CSS. Border, background. Введение

Как вы помните, в посте про мигающий текст мы начали немного говорить про CSS. Так вот хочу продолжить, но не "планово" по шагам, а так... урывками:) Для начала:)

Сегодня будем делать обводку и фон. Чего именно? Да чего хотите:)
Кто сказал что тег <b> (жирное написание текста) не может быть с фоном и обводкой?
Пожалуйста:



Привет

Или:Привет

Или:Привет



Или:Привет



Читать дальше > > >

Серия сообщений "HTML":
Часть 1 - Ищем ссылку! Урок о том, чего лучше не делать, но знать об этом надо
Часть 2 - Чем отличаются BB коды от тегов html?
...
Часть 4 - Html шпаргалки
Часть 5 - Подсказка title
Часть 6 - CSS. Border, background. Введение
Часть 7 - Поля для кодов. Внешний вид и пр.
Часть 8 - Html для начинающих ( часть 5-ая, практикуемся)
...
Часть 12 - Html для начинающих ( часть 2-ая)
Часть 13 - Начинаем изучать html
Часть 14 - Как быстро взять картинку без кода и вставить в нужное место.


Подсказка title

Пятница, 09 Марта 2012 г. 13:41 + в цитатник
Это цитата сообщения Legionary [Прочитать целиком + В свой цитатник или сообщество!]

Подсказка title

Вообще очень полезная вещь при оформлении. Когда-то, мимолетом мы уже об этом говорили, тут, например.

О чем это я собственно:) На примере:

Наведите на этот текст курсор мышки и подождите пару секунд.

Если навели правильно (смеюсь),- увидите примерно следующее:

Читать далее > > >

Серия сообщений "HTML":
Часть 1 - Ищем ссылку! Урок о том, чего лучше не делать, но знать об этом надо
Часть 2 - Чем отличаются BB коды от тегов html?
Часть 3 - А вы прописываете альты (alt)?
Часть 4 - Html шпаргалки
Часть 5 - Подсказка title
Часть 6 - CSS. Border, background. Введение
Часть 7 - Поля для кодов. Внешний вид и пр.
...
Часть 12 - Html для начинающих ( часть 2-ая)
Часть 13 - Начинаем изучать html
Часть 14 - Как быстро взять картинку без кода и вставить в нужное место.


Html шпаргалки

Пятница, 09 Марта 2012 г. 13:41 + в цитатник
Это цитата сообщения Legionary [Прочитать целиком + В свой цитатник или сообщество!]

Html шпаргалки

Давно хотел написать этот пост:) Из области "наболело".
Я правда не знаю как сейчас обстоят дела, но в тот период моего прибывания на лиру (до "отпуска" :) ), большим спросом у вас пользовались различные html шпаргалки. Причем... не идеального "качества"... Что удручает...

Как вы знаете, я тоже пишу некое подобие уроков на тему html. Т.е. в принципе изобретаю велосипед. Ведь статей, учебников и пр. на эту тему уже написано великое множество.
Единственно, чем я могу себя оправдать - моя манера повествования и объяснения, возможно, более понятна кому-либо. Поэтому и пишу:)

Но речь не о том. Пока я напишу ВСЕ... состариться можно:)

Поэтому, вместо коллекционирования всяких второсортных html шпаргалок, тем, кому действительно интересна эта тема, советую посетить сайт Влада Мержевича.

Мало кто не знает этот сайт. Но все же... Записав в закладки его htmlbook.ru, вам уже не нужны будут всякие шпаргалки.
Да там все строго и по факту, без особых разжевываний. Но если есть желание,- разобраться всегда можно:)

Навигация отличная, не запутаетесь:) Дам только две наводящие ссылки:
Справочник по HTML
Справочник по CSS

В выбранном справочнике смотрим слева - список тегов и атрибутов. Тыкаем нужный и узнаем всю необходимую информацию.
Сам я учился не на его сайте, но сейчас пробелы в памяти заполняю именно там:) Чего и всем советую:)

Ну а кто особо не спешит,- ждите моих уроков, будут:)

Серия сообщений "HTML":
Часть 1 - Ищем ссылку! Урок о том, чего лучше не делать, но знать об этом надо
Часть 2 - Чем отличаются BB коды от тегов html?
Часть 3 - А вы прописываете альты (alt)?
Часть 4 - Html шпаргалки
Часть 5 - Подсказка title
Часть 6 - CSS. Border, background. Введение
...
Часть 12 - Html для начинающих ( часть 2-ая)
Часть 13 - Начинаем изучать html
Часть 14 - Как быстро взять картинку без кода и вставить в нужное место.


А вы прописываете альты (alt)?

Пятница, 09 Марта 2012 г. 13:40 + в цитатник
Это цитата сообщения Legionary [Прочитать целиком + В свой цитатник или сообщество!]

А вы прописываете альты (alt)?

Или ленитесь? Признавайтесь?:)

Что это?
Alt - это альтернативный текст изображения. Атрибут тега img (тега вставки изображения)


Зачем это?
Ну для начала, любой html валидатор будет ругаться если у вас не прописаны альты ( валидатор - программа проверяющая правильность html) - уже не оч хорошо:)

Гуляя про просторам инета, любой пользователь может отключить показ изображений на сайтах ( отключается в браузере, например, для экономии трафика ) - и чито он увидит вместо ваших картинок?... Ничего хорошего не увидит:)
А вот если алт прописан, пользователь хотя бы увидит некий текст. Какой придумаете. Например :" Тут клевая картинка, зря не посмотрел" :)))
Ну шутки шутками.
А вечная история не отображения в посте картинок? Пустое место не воодушевляет... так бы хоть альты почитали:)

Как прописать alt?

Пишется элементарно:
<img src="сама ссылка на картинку" alt="тут в кавычках тот самый альтернативный текст">

Если вы загружаете картинку на лиру, нам альты пропишут автоматически:

1 (700x23, 9Kb)

Но в качестве альтернативного текста будет размер и вес картинки... что не очень информативно:(
Поэтому советую переписывать такие альты на свои, более логичные:)

Серия сообщений "HTML":
Часть 1 - Ищем ссылку! Урок о том, чего лучше не делать, но знать об этом надо
Часть 2 - Чем отличаются BB коды от тегов html?
Часть 3 - А вы прописываете альты (alt)?
Часть 4 - Html шпаргалки
Часть 5 - Подсказка title
...
Часть 12 - Html для начинающих ( часть 2-ая)
Часть 13 - Начинаем изучать html
Часть 14 - Как быстро взять картинку без кода и вставить в нужное место.


Чем отличаются BB коды от тегов html?

Пятница, 09 Марта 2012 г. 13:39 + в цитатник
Это цитата сообщения Legionary [Прочитать целиком + В свой цитатник или сообщество!]

Чем отличаются BB коды от тегов html?

Не замучил еще тегами и кодами?:)

Для удобства "понимания" в качестве примера возьмем лирушные BB коды.
И это кстати важная особенность:
На разных сайтах ВВ коды могут быть разными, а некоторых кодов может вообще не быть

Итак, все вы знаете (надеюсь) html тег жирности текста. Пишется так:
<b>Привет!</b>

Но на нашей лирушечки, сделать текст жирным мы можем и с помощью ВВ кода, т.е. так:
[b]Привет![/b]

Разница, как видите, только в скобках- html тег пишется в таких ><, а ВВ в [ ]
Но! Это только кажется так просто.

Читать далее > > >

Серия сообщений "HTML":
Часть 1 - Ищем ссылку! Урок о том, чего лучше не делать, но знать об этом надо
Часть 2 - Чем отличаются BB коды от тегов html?
Часть 3 - А вы прописываете альты (alt)?
Часть 4 - Html шпаргалки
...
Часть 12 - Html для начинающих ( часть 2-ая)
Часть 13 - Начинаем изучать html
Часть 14 - Как быстро взять картинку без кода и вставить в нужное место.


Ищем ссылку! Урок о том, чего лучше не делать, но знать об этом надо

Пятница, 09 Марта 2012 г. 13:39 + в цитатник
Это цитата сообщения Legionary [Прочитать целиком + В свой цитатник или сообщество!]

Ищем ссылку! Урок о том, чего лучше не делать, но знать об этом надо

Всем огромный привет!

Сей пост - урок от "противного". Все помнят историю с "синими квадратиками" в комментах? Спамеры этакэ:)

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

Суть в том, что мы просто делаем нашу ссылку точно такой же как и весь текст сообщения, поста и пр.
Кто еще не догадался, в предложении "Всем огромный привет!" слово "огромный" - это ссылка, можете кликнуть:)


Читать дальше > > >

Серия сообщений "HTML":
Часть 1 - Ищем ссылку! Урок о том, чего лучше не делать, но знать об этом надо
Часть 2 - Чем отличаются BB коды от тегов html?
Часть 3 - А вы прописываете альты (alt)?
...
Часть 12 - Html для начинающих ( часть 2-ая)
Часть 13 - Начинаем изучать html
Часть 14 - Как быстро взять картинку без кода и вставить в нужное место.



Поиск сообщений в Blagostrofa
Страницы: 207 ... 94 93 [92] 91 90 ..
.. 1 Календарь