-Рубрики

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

Поиск сообщений в Татьяна_Гусакова

 -Статистика

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

Выбрана рубрика Коды.


Соседние рубрики: Шрифты(13), Шпаргалки(15), Цвета(24), Фоны(88), Уроки по дневнику(53), Умные подсказки(25), Схемы(12), Создание фонов(1), создание рамок(25), Рубрики(1), Редактор(3), Рамочки(229), Разделители(16), Радикал(1), Прокрутки(4), Полезные сайты и ссылки(31), Плеера(24), Оформление(23), Наведем порядок(1), Кнопки(5), Картинки(60), Календари(2), Защита дневника(4), Генератор надписей(2), Бродилки(8), Бордюры(1)

Другие рубрики в этом дневнике: Эдитор(10), ЦВЕТЫ(20), Хозяйственные советы(2), Харитоныч(9), ФОТО(118), ФЛЕШКИ(0), ФИЛЬМЫ(7), УРОКИ(176), СТИХИ(336), РУССКИЙ ЯЗЫК(19), Рукоделие(4), РОССИЯ(21), РЕТРО(1), РЕЛИГИЯ(74), РАЗНОЕ(1004), Радикал(1), Птицы(15), Психология(1), ПРОГРАММЫ(15), ПРИРОДА(3), Пресса(1), ПРАЗДНИКИ(124), ПОЛИТИКА(280), Панорамы(1), ПАНОРАМЫ(6), МУЗЫКА(386), МОИ РАБОТЫ(19), МАНТРЫ(2), ЛЮБАША К(82), ЛЮАРДЕ(60), ЛУННЫЙ СВЕТ - ЗАХАРИНКА(70), ЛИТЕРАТУРА(6), КУЛЬТУРА(5), КОЛЛАЖИ(87), КЛИПАРТ(33), КАРТИНКИ(18), ИСКУССТВО(72), ИГРУШКИ(7), ЗДОРОВЬЕ(179), ЖИВОТНЫЕ(84), ЖИВОПИСЬ(208), ЖЖ(27), ДОНБАС(1), ДЕМОТИВАТОРЫ(1), ДАЧА(27), ВКУСНО(257), ВИДЕОФИЛЬМЫ(5), ВИДЕОРОЛИКИ(57), ВАША ТАНЯ, ИДУЩАЯ ПО СУДЬБЕ(5), БЛОГИ(680), БИБЛИОТЕКИ(34), БАЛЕТ(3), АРХИТЕКТУРА(1), Vi-NATALKA(50), SURGE BLAVAT (41), Selesta_L(5), DMITRU SHVARTS(7), Antonina-Dol(2)
Комментарии (8)

Как увидеть пароль вместо звездочек? Основные коды для оформления блога

Среда, 29 Марта 2028 г. 03:34 + в цитатник
Это цитата сообщения Шадрина_Галина [Прочитать целиком + В свой цитатник или сообщество!]

Как увидеть пароль вместо звездочек?


Как увидеть пароль вместо звездочек?
1223222401_gifs_divers.gifНа многие сайты мы заходим под паролями, например ОДНОКЛАСНИКИ, МОЙ МИР, ФОТОСТРАНА и многие другие. И все пароли запомнить невозможно. Современные браузеры всегда запрашиваю -СОХРАНЯТЬ ИЛИ НЕТ ваш пароль для входа, и мы их конечно сохраняем. Но иногда надо зайти на сайт с другого компа. Или хотите поменять свой пароль на новый, а старый не помните, так как сохранили пароль в браузере, нажав на кнопку - "Запомнить пароль", и забыли о нем. При попытке посмотреть его, мы увы, увидим только звездочки. Как же увидеть свой полный, но забытый нами пароль.


Рубрики:  БЛОГИ/Коды

Метки:  
Комментарии (2)

HTML

Понедельник, 03 Января 2028 г. 08:21 + в цитатник
Это цитата сообщения LiSu [Прочитать целиком + В свой цитатник или сообщество!]

HTML

Центровка

Картинка слева от текста

Картинка справа от текста

Картинки по бокам от текста

Текст по бокам картинки

Бегущая строка

Подпись

Окошко под код

Баннер

4 картинки в ряд

Выпадающий список

Текст с прокруткой

Фш разрезная рамочка

Рамочка с разрывом

Размер картинки

 

Таблица из двух столбцов

Текст на картинке

 

Текст в 2 столбика

Рубрики:  БЛОГИ/Коды

Метки:  
Комментарии (0)

Справочник HTML5 - Теги HTML (Рuzzleweb.ru)

Понедельник, 15 Августа 2016 г. 18:18 + в цитатник
Это цитата сообщения Ваша_ТАНЯ_идущая_по_Судьбе [Прочитать целиком + В свой цитатник или сообщество!]

Справочник HTML5 - Теги HTML (Рuzzleweb.ru)

Счетчик посещений Counter.CO.KZ - бесплатный счетчик на любой вкус!

4026647_Spravochnik_HTML5__Tegi_HTML (650x475, 80Kb)

ЧИТАЙТЕ ДАЛЬШЕ take_example

Ваша ТАНЯ,идущая по Судьбе
Рубрики:  БЛОГИ/Коды
БЛОГИ/Шпаргалки
БЛОГИ/Умные подсказки

Метки:  
Комментарии (4)

Интервалы в тексте

Вторник, 17 Марта 2015 г. 12:13 + в цитатник
Это цитата сообщения Юлия_Гурбер [Прочитать целиком + В свой цитатник или сообщество!]

Интервалы в тексте

Межстрочный интервал равен 2. То есть расстояние от строчки до строчки в 2 раза больше размера шрифта. Увеличивать и уменьшать интервал можно прибавляя, либо отнимая по одной десятой. Пример: 1.7, 1.8, 1.9, 2, 2.1, 2.2, 2.3 и т. д.



Расстояние между словами составляет 15 пикселей.



Интервал между буквами равен 8 пикселям.



Смотрим дальше

Рубрики:  БЛОГИ/Коды
БЛОГИ/Шпаргалки

Метки:  
Комментарии (3)

Цветное окошко для кода

Пятница, 09 Января 2015 г. 15:42 + в цитатник
Это цитата сообщения Юлия_Гурбер [Прочитать целиком + В свой цитатник или сообщество!]

Цветное окошко для кода

Не мной придумано, но вещь полезная. Без окошек для кодов нам не
обойтись при написании многих постов.
Вот простенькое, с прозрачным фоном:

А это код нашего простого окошка:

При необходимости меняем размер. Атрибут cols="15" отвечает за
ширину окошка. Меняем цифру "15" на нужную нам. Атрибут rows="1" отвечает за высоту. Вместо "1" можем поставить "2", например.

А можно украсить наше окошко цветом, вот так:

Вот код цветного окошка:

Смотрим дальше
Рубрики:  БЛОГИ/Коды
БЛОГИ/Шпаргалки

Метки:  
Комментарии (3)

Продолжение знакомства с HTML

Суббота, 23 Августа 2014 г. 11:26 + в цитатник
Это цитата сообщения Surge_Blavat [Прочитать целиком + В свой цитатник или сообщество!]

Продолжение знакомства с HTML

ИЗУЧАЕМ И ИСПОЛЬЗУЕМ
БЛОГГЕРСКИЙ ЯЗЫК HTML
Основной текст

Совсем недавно я выставил пост со ссылками на шпаргалки по HTML. В дневнике есть немало постов с формулами и кодами HTML.

Продолжаем знакомство с сайтами, где доступно объясняется применение языка HTML. Не забывайте смотреть записи с метками по этой теме и у ваших друзей, подсказок много.

Формула кнопки "выпадающего" меню


 

Написать текст прямо на картинке в записи

 

Серия сообщений "SURGE BLAVAT ":
Часть 1 - А вы знаете, что... во всём Россия виновата...
Часть 2 - Достоевский о России, славянах и Булочки от американской леди
...
Часть 14 - Документы, формы, бланки онлай
Часть 15 - МиниФотошоп
Часть 16 - Продолжение знакомства с HTML
Часть 17 - Европа и Америка отмечают ДР Президента России
Часть 18 - Продолжение обзора постов блога Eclettico
...
Часть 39 - Онлайн приложения и сервисы - много...
Часть 40 - К 80-летию Юнны Мориц
Часть 41 - Открытие Крымского моста_Кот Мостик_10 советов

Рубрики:  БЛОГИ/Коды

Метки:  
Комментарии (4)

HTML_всё под рукой

Четверг, 21 Августа 2014 г. 07:29 + в цитатник
Это цитата сообщения Surge_Blavat [Прочитать целиком + В свой цитатник или сообщество!]

HTML_всё под рукой

⇖            ⇗

Это должно быть "всегда под рукой" Формулы разметки гипертекста.

Форматирование Теги Атрибуты Графика Линии Рамки Кнопки Символы

Ещё самоучители и коды

Полезные сайты - справочники

 htmlka.com — помощь блогеру

 

Рубрики:  БЛОГИ/Коды

Метки:  
Комментарии (0)

Как быстро найти нужное в коде

Вторник, 04 Марта 2014 г. 21:14 + в цитатник
Это цитата сообщения Егорова_Таня [Прочитать целиком + В свой цитатник или сообщество!]

Как быстро найти нужное в коде

КАК БЫСТРО В БОЛЬШОМ КОДЕ
НАЙТИ НУЖНОЕ СЛОВО ИЛИ ЗНАКИ

Те, кто делает рамки, особенно новички, частенько теряют много времени, отыскивая в большом коде нужные участки, чтобы внести свои изменения. Иногда даже "Здесь будет Ваш текст" трудновато обнаружить с первого раза.

Читать далее


еще разные уроки
Что можно скачать бесплатно
Рубрики:  БЛОГИ/Коды

Метки:  
Комментарии (0)

КОД РАЗРЕЗНОЙ БРОДИЛКИ ДЛЯ ЛИРУ

Пятница, 14 Февраля 2014 г. 04:10 + в цитатник
Это цитата сообщения Светлана53 [Прочитать целиком + В свой цитатник или сообщество!]

КОД РАЗРЕЗНОЙ БРОДИЛКИ ДЛЯ ЛИРУ

Free image hosting and photo sharing
КОД РАЗРЕЗНОЙ БРОДИЛКИ ДЛЯ ЛИРУ


Рубрики:  БЛОГИ/Коды

Метки:  
Комментарии (2)

Пишем на картинке

Понедельник, 10 Февраля 2014 г. 14:09 + в цитатник
Это цитата сообщения ВАЛЁНКА_-Я [Прочитать целиком + В свой цитатник или сообщество!]

пишем на картинке





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

Адрес картинки вставляется через Фоторадикал: http://www.radikal.ru/ (Ссылка № 1)

В значения width и height вместо многоточий ставятся размеры картинки
(их можно узнать из пункта “Свойства” вашей картинки, нажав правую мышку, либо в том же Радикале)





вот так у меня получилось

Ах,что вы делаете,женщины,
И по каким таким причинам
Самоотверженно и жертвенно
Вы угождаете мужчинам????
Рубрики:  БЛОГИ/Коды

Метки:  
Комментарии (2)

Как можно расположить картинки в тексте УРОК

Суббота, 18 Января 2014 г. 19:06 + в цитатник
Это цитата сообщения Arnusha [Прочитать целиком + В свой цитатник или сообщество!]

Как можно расположить картинки в тексте УРОК

Очень актуальная тема. Половина пользователей на Ли.ру очень не любит рамочки для текста, особенно если они все блестят, сверкают..и очень длинные. А если еще и трафик не позволяет и комп тормозит....И я знаю точно, из-за этого не читают ваши работы. Но это всё лирика. На всех и не угодишь. В основном этот урок для начинающих пользователей. Очень удобно, компактно и красиво можно расположить и стихи и картинки как в рамочке, так и без нее. Может кому и пригодится. А у кого длинные посты, для тех в конце поста код прокрутки. Может кому пригодится. Итак:

КАРТИНКА МЕЖДУ ТЕКСТОМ

Привыкайте счастливыми быть!
Просыпаться с улыбкой лучистой…
И со взглядом, по детскому, чистым,
Привыкайте друг друга любить…

Научитесь плохое не звать,
Предвещая заранее беды…
Вы ведите другие беседы…
Научитесь душой расцветать…

Привыкайте добро замечать
И ценить то, что жизнью даётся…
И за счастьем бежать не придётся…
Будет счастье за вами бежать!


Научитесь подвоха не ждать
От людей незнакомых и близких…
Ведь у всех, у высоких, и низких
Есть желание – счастье познать…

Привыкайте не злиться на зло,
А рискните помочь, разобраться…
Если кто-то вдруг начал кусаться,
Значит, в чём-то ему не везло…

Научитесь прощенья просить
И прощать… Вам судьба улыбнётся.
И весна в вашу душу вернётся!
Привыкайте счастливыми быть….

автор Ирина Самарина

КОД ТАБЛИЦЫ

<table align="center" border="0"><tr><td>ВАШ ТЕКСТ</td><td><img src="URL адрес КАРТИНКИ" />
</td><td>ВАШ ТЕКСТ</td></tr></table>


идем дальше
Рубрики:  БЛОГИ/Коды

Метки:  
Комментарии (2)

Список уроков.Как ОФОРМИТЬ ДНЕВНИК.

Воскресенье, 05 Января 2014 г. 06:46 + в цитатник
Это цитата сообщения SvetlanaT [Прочитать целиком + В свой цитатник или сообщество!]

Список уроков.Как ОФОРМИТЬ ДНЕВНИК.











Здесь я собрала всё самое Основное,
И НЕОБХОДИМОЕ,в одном месте-
что вам может понадобиться...
Для ОФОРМЛЕНИЯ своего дневничка.
И как сделать его красивым и интересным.
Выбирайте,что вам нужно и нажимайте О,КЕЙ.

Рубрики:  БЛОГИ/Коды
БЛОГИ/Цвета
БЛОГИ/Уроки по дневнику
БЛОГИ/Оформление

Метки:  
Комментарии (0)

Оформление текста с картинкой с помощью ПРОКРУТКИ

Четверг, 14 Ноября 2013 г. 15:57 + в цитатник
Это цитата сообщения Ваша_ТАНЯ_идущая_по_Судьбе [Прочитать целиком + В свой цитатник или сообщество!]

Оформление текста с картинкой с помощью ПРОКРУТКИ

Счетчик посещений Counter.CO.KZ - бесплатный счетчик на любой вкус!

урок БЛОГГЕР прокрутка (281x383, 33Kb)

 

Оформление текста с картинкой с помощью ПРОКРУТКИ

Для оформления объемного текста  с картинкой вместо функции " под КАТ " удобно использовать  так называемую "ПРОКРУТКУ"...
...посмотреть, как все это выглядит и скопировать формулу  ПРОКРУТКИ можно ...

 

ЗДЕСЬ <<<=== ЖМИТЕ

Рубрики:  БЛОГИ/Коды

Метки:  
Комментарии (4)

Таблица HTML кодов

Среда, 13 Ноября 2013 г. 06:37 + в цитатник
Это цитата сообщения Beauti_Flash [Прочитать целиком + В свой цитатник или сообщество!]

Таблица HTML кодов


Предлагаю вам таблицу кодов
может вам пригодится

КОДЫ ДЛЯ БЛОГОВ

Картинка или текст
Окошко для кода -
Рамочка вокруг текста -
Рамочка вокруг текста (разрыв слева) -
Рамочка вокруг текста (разрыв справа) -
Картинки в записи
Картинка слева от текста -
Картинка справа от текста -
Картинки по бокам текста -
Картинки в ряд:
2 картинки -
3 картинки -
4 картинки -
5 картинок -
6 картинок -

Кнопки в записи
Текст на кнопке -
Картинка на кнопке -
Текст и картинка на кнопке -
Кнопка на фоне -

Номера страниц в блоге -
Рамка с картинками по углам -
Таблица -



Рубрики:  БЛОГИ/Коды

Метки:  
Комментарии (2)

РАМКА с флешкой и текстом в прокрутке

Воскресенье, 27 Октября 2013 г. 22:20 + в цитатник
Это цитата сообщения Ваша_ТАНЯ_идущая_по_Судьбе [Прочитать целиком + В свой цитатник или сообщество!]

РАМКА с флешкой и текстом в прокрутке

Счетчик посещений Counter.CO.KZ - бесплатный счетчик на любой вкус!







Старушка дряхлая сказала: Запомни истину сынок!
Ты в жизни счастья не познаешь, когда в душе висит замок.
Не ешь того, что глаз не хочет, не лезь туда, где не твое.
Жизнь бумерангом возвращает, ответь за слово ты свое.
Сказав, тот час же это сделай, иначе будешь пустобрёх.
Живи для тех, кого ты любишь, чтоб в тишине один не сдох.
Люби, стремись и добивайся, иначе будет пустота.
Не говори, что жизнь помойка, когда стратегия не та.

(с)





Серия сообщений "для ЛИру,МАЙЛа,Яру по одной формуле":

Часть 1 - формула рамки в 1 слой для ЛИру,МАЙЛа и Яру
Часть 2 - образец рамки в 1 СЛОЙ для ЛИру,МАЙЛа и Яру
...
Часть 36 - НЕ ДЕЛАЙТЕ ТАК НИКОГДА
Часть 37 - РАМОЧКА с ФЛЕШКОЙ и ТЕКСТОМ в ПРОКРУТКЕ
Часть 38 - РАМКА с флешкой и текстом в прокрутке
Часть 39 - унифицированные формулы рамок для ЛИру,Майла,Яру и ЖЖ
Часть 40 - ЛИРУШКИН ЛИКБЕЗ - с дополнениями


Рубрики:  БЛОГИ/Коды

Метки:  
Комментарии (3)

Кнопки, убирающие текст под кат.

Вторник, 22 Октября 2013 г. 19:03 + в цитатник
Это цитата сообщения Arnusha [Прочитать целиком + В свой цитатник или сообщество!]

Как правильно использовать "кнопки, убирающие текст под кат. Урок"


По многочисленным просьбам объясняю, как правильно пользоваться кнопками, с помощью которых,текст убирается под кат. Ими можно и не пользоваться, но мы делаем некоторые посты, где эти кнопочки украшают пост и всем понятно, что нажав на нее, попадаешь на страничку автора и пост откроется целиком. Итак, возьмем пока вот эти две кнопочки:

Вот код одной из них, в данном случае второй кнопки:

<img src="//img-fotki.yandex.ru/get/6608/39663434.1aa/0_78a2e_d0a4bc72_XS.jpg" alt="" width="23" height="49"/>



Для начала еще раз повторяю код, с помощью которого текст убирается под кат, вот он:

[more]



Если поставить только этот тег(сами решаете, в какое место его поставить), то автоматически остальная часть уберется под кат
Можно и вписать свой текст, ну например такой:

[more=Самое интересное под катом]


Здесь читатель увидит эти слова и нажав на них,прочитает текст целиком.
Надеюсь, с эти мы разобрались с вами. А теперь про кнопки.
Если вы поставите вот так, как я указала в рамочке ниже, то будет стоять одна кнопочка, без текста и она будет кликабельна. И нажав на нее, читатель увидит пост целиком.

[more=<img src="//img-fotki.yandex.ru/get/6608/39663434.1aa/0_78a2e_d0a4bc72_XS.jpg" alt="" width="23" height="49"/>]


В рамочке после слов more=следует код кнопочки, вы выбираете свою кнопочку и вставляете в квадратные кнопки полностью код. Повторюсь, что в этом случае будет стоять одна кликабельная кнопочка,но без текста.
Можно и с текстом, кому как нравится. С текстом все должно будет выглядеть вот так, то есть мы должны будем добавить в код, который выше, свой текст:

<center>[more=
<center><img src="//img-fotki.yandex.ru/get/6608/39663434.1aa/0_78a2e_d0a4bc72_XS.jpg" alt="" width="23" height="49"/><center>ЖМИ]


Вот что должно получится, когда вы поставите этот код:
[more=

ЖМИ]
Здесь пришлось показать в коде,потому что в отличие от Я.ру, на Ли.ру два раза убирать под кат нельзя,картинка просто не будет видна.А вот на Я.ру можно.

По поводу кнопочек, которые указывают в сторону, я их использую редко и в том случае, когда надо нажать на баннер,например. То есть рядом должна стоять картинка, на которую надо нажать, на что и будет указывать кнопка.Так же все ставим, как и в последнем коде, только вместо текста, в моем случае слово "ЖМЁМ", вот вместо него ставим картинку баннер, точнее код баннера, чтобы читателю было понятно, на что он должен нажать, кнопка указывает направление...
И последнее, код кнопок не должен быть кликабельным, то есть в нем не должно стоять вот этой части кода, которая ведет на посторонний ресурс:

<a href="адрес сайта,откуда картинка">


В противном случае,пост не откроется, а ссылка приведет на сайт, например на РАДИКАЛ, как ошибочно тут думают, ставя коды оттуда. Какие будут вопросы, пишите в личку, всем отвечу. Завтра напишу вам, как сделать рамку с прокруткой.Удачи,экспериментируйте!


Рубрики:  БЛОГИ/Коды

Метки:  
Комментарии (2)

Простые рамочки

Пятница, 18 Октября 2013 г. 01:31 + в цитатник
Это цитата сообщения О_себе_-_Молчу [Прочитать целиком + В свой цитатник или сообщество!]

Простые рамочки (по просьбе трудящихся :))_)

Скопируйте код и развлекайтесь :))



_ya1 (698x244, 44Kb)

Вместо Х1, Х2, Х3 - надо ставить шестизначный код цвета.

Код цвета можно ТУТ взять. Для меня - это самый удобный вариант.
Но можно просто пользоваться таблицей - ТУТ Читать далее
Рубрики:  БЛОГИ/создание рамок
БЛОГИ/Коды

Метки:  
Комментарии (0)

ПРОСТЫЕ РАМОЧКИ и ШРИФТ

Пятница, 18 Октября 2013 г. 01:19 + в цитатник
Это цитата сообщения О_себе_-_Молчу [Прочитать целиком + В свой цитатник или сообщество!]

ПРОСТЫЕ РАМОЧКИ и ШРИФТ

Увидала в цитате примеры простых рамочек с каким-то диким, совершенно неудобоваримым кодом, да ещё и внизу рамочки ссылка на "дизайнера" (?!! )
Не будем называть имён )
А между тем, всё намного проще и рамочку можно склепать за одну минуту, пользуясь очень простым кодом!

ВАШ ТЕКСТ
Рамочка раздвигается сама по ширине текста

РАМОЧКА С ЗАДАННОЙ ШИРИНОЙ
(по вертикали она сама раздвинется)

В эти же рамочки можете вставлять картинки, плеер, видео.

_для тех, кто хочет научиться_
_коды, о шрифтах_
Ещё "Простые рамочки" ТУТ_0 0 себе молчу РїСЂ (104x50, 8Kb)
Рубрики:  БЛОГИ/создание рамок
БЛОГИ/Коды

Метки:  
Комментарии (0)

ЕЩЁ О HTML-кодах.Урок.

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

ЕЩЁ О HTML-кодах.Урок.



Интересные HTLM-коды

1. Ваш текст в объемной 3D-рамке

Размеры блока div задаются атрибутами:
div style=width:200px; height:50px;
где width:200px; - ширина блока 200 пикселей,
height:70px; - высота блока 70 пикселей,


border-color:#8800dd; - цвет рамочки (его можно изменить, поставив после знака # другое значение).

Получим:


Ваш
текст в объемной 3D-рамке - размеры рамки здесь фиксированые

 


Код:  



2. Если не задавать вышеуказанные параметры - получается так:
Ваш текст в объемной 3D-рамке - на всю ширину поста

 


Код:


Цвет можно подбрать здесь



3. Всплывающее окошко с пояснением при наведении на текст курсора:


Код:

Подведите курсор к этому тексту



4. Правильное (и уважительное) указание автора под скопированным текстом
(цитатой) с всплывающей дополнительной информацией при наведении курсора.
Пример:

©Arnusha

Код:




Arnusha
Рубрики:  БЛОГИ/Коды

Метки:  
Комментарии (0)

HTML & CSS

Вторник, 16 Апреля 2013 г. 11:28 + в цитатник
Это цитата сообщения Arnusha [Прочитать целиком + В свой цитатник или сообщество!]

HTML & CSS - серия 5

Серия 1

Серия 2

Серия 3

Серия 4



Гиперссылки

Ссылка на http://...

Большинство ссылок в Интернете ведут на какую нибудь веб-страницу с адресом наподобие http://site.ru или http://site.ru/index.html.

Расширение
.html указывает на то, что мы имеем дело с файлом формата HTLM. Однако
cсылка может привести нас к документу практически любого формата: .jpg,
.doc, .pdf, .mp3, .zip... перечислять все было бы долго и бессмысленно.
Иногда она может оказаться прямой ссылкой на скачивание файла (возможно,
не вполне желательного).

Для наших целей важно только то, что
ссылка содержит адрес нужного нам файла в сети и указание на протокол
доступа к этому файлу (HTTP). Как же добавить такую ссылку?

Для этого используем парный тег <a...>...</a>. Напишем, например, следующее:

<a href="http://yandex.ru" title="Яндекс" target="_blank">Найдётся всё!</a>

Вот наша ссылка:

Найдётся всё!

Теперь - что здесь к чему.

http://yandex.ru
- тот адрес в сети, куда мы хотим отправить наших посетителей. Без
подобного указания наш тег вообще не будет работать. То, что идёт
дальше, писать не обязательно, но иногда полезно.

title="Яндекс" - всплывающая подсказка. Если здесь ничего не писать, то такой подсказки не будет.

target="_blank"
- указание браузеру открыть ссылку в отдельном окне (вкладке). По
умолчанию ссылка открывается в том же окошке, в котором находился
посетитель, просматривая Вашу страницу. Впоследствии, если он захочет
продолжить просмотр, ему придётся возвращаться назад.

Как удобнее открывать ссылки - дело вкуса. Казалось бы, новые окна (вкладки) хороши. Но часто их становится слишком много.

Между тегами <a...> и </a>
мы пишем то, что будет видеть посетитель страницы. Кстати, это не
обязательно должен быть текст - можно использовать изображение. Для
того, чтобы использовать картинку в качестве ссылки, напишем, например,

<a href="http://yandex.ru" title="Яндекс" target="_blank"><img src="http://www.promolive.ru/images/content/logo-yandex.gif"></a>

Получим вот такой результат:

Если
мы хотим, чтобы изображение менялось при наведении указателя мыши,
необходимо использовать скрипт (на Ярушке он не работает).

Стили
гиперссылок на Яндексе заданы довольно жёстко. Цвет (а также вид, размер
шрифта и т.д.) самой гиперссылки ещё можно поменять. Делается это путём
добавления в тег <a...> аттрибута style (о нём шла речь в предыдущих сериях). Для примера поменяем только цвет, сделав его зелёным. Напишем:

<a href="http://yandex.ru" title="Яндекс" target="_blank" style="color:green">Найдётся всё!</a>

Получим:

Найдётся всё!

Обратите
внимание, что теперь цвет посещённой ссылки не отличается от цвета
непосещённой. При наведении курсора ссылка по-прежнему становится
красной. Способа изменить это я пока не нашла.

Ссылка на любое место на Вашей страничке*

Для
того, чтобы сослаться на определённое место на Вашей страничке, сначала
на этом месте надо установить "якорь". Например, мы пишем статью из
нескольких частей. Заголовок части 1 поместим внутри контейнера <a...>...</a>:

<a name="part 1">Часть 1. Вместо предисловия</a>

Если в имени якоря не используется пробел, то можно обойтись без кавычек: name=part1.

Далее пойдёт текст этой самой первой части. Добавим сюда часто используемый для тестирования текст "Lorem ipsum"** (чтобы ничего не придумывать). Вот как будет выглядеть наша первая часть:

Часть 1. Вместо предисловия

Lorem
ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa qui officia deserunt
mollit anim id est laborum.

А теперь мы хотим получить
возможность вернуться к началу нашей части 1. На том месте, откуда мы
хотим сделать такой переход, пишем следующее:

<a href="#part 1">читать часть 1</a>

Получаем
гиперссылку, ничем принципиально не отличающуюся от "обычной" (к ней
применимо всё, что говорилось выше, в том числе - про возможность
добавить всплывающую подсказку, стиль и заставить открываться в новом
окне):

читать часть 1

Кликнув на этой ссылке, перейдём к началу части 1.



*На Я.ру работает в пределах одной записи.

**Lorem ipsum
- название классического текста-«рыбы». «Рыба» - слово из жаргона
дизайнеров, обозначает условный, зачастую бессмысленный текст,
вставляемый в макет страницы. Lorem ipsum представляет
собой искажённый отрывок из философского трактата Цицерона «О пределах
добра и зла», написанного в 45 году до нашей эры на латинском языке.
Впервые этот текст был применен для набора шрифтовых образцов
неизвестным печатником в XVI веке (информация из Википедии).

Другие виды ссылок

Вероятно, Вы встречали на некоторых сайтах ссылки вида "пишите мне". Подобная ссылка устроена следующим образом:

<a href="mailto:address@yandex.ru">пишите мне</a>

Вот она: пишите мне

При
клике на этой ссылке, скорее всего, запустится Яндекс-почта
(проверьте). А вот при нажатии колёсика мыши запускается почтовый
клиент.

В настоящее время подобные ссылки без специальных приёмов
маскировки практически не используются: дело в том, что роботы легко
находят содержащиеся в ссылках почтовые адреса, и они попадают в базы
для рассылки спама.

В некоторых случаях могут использоваться и другие гиперссылки, например, использующие протокол ftp. Вероятнее всего, они Вам не понадобятся. В них нет ничего сложного (всего лишь один протокол заменяется другим).
Источник Проксима



Arnusha

Рубрики:  БЛОГИ/Коды

Метки:  

 Страницы: [3] 2 1