-Рубрики

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

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

 -Статистика

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


ПОЙДЕМ ДАЛЕЕ КРАСИВО И СТИЛЬНО...

Пятница, 16 Декабря 2016 г. 13:22 + в цитатник
Цитата сообщения ka82 Еще у других кнопочки такие или такие
2 (217x55, 16Kb) далее (147x95, 16Kb) далее (155x100, 20Kb) 1 (160x92, 23Kb) далее1 (158x77, 16Kb) далее2 (161x89, 17Kb) 342 (294x47, 22Kb) далее3 (234x59, 8Kb) 1 (140x130, 19Kb)
0_697cc_bdfeafa1_L (432x17, 8Kb)

Когда большой объем текста прячем под кат, то пишем в каком-то определенном месте [more]. В итоге получается строчка Читать далее, а весь текст за словом [more] убирается под кат, т.е. становится виден только когда Вы нажимаете на слова типа Читать далее. При желании мы меняем Читать далее на какие-нибудь слова типа Смотреть здесь (тогда напишите [more=Смотреть здесь], Жмякай сюда (тогда напиши [more=Жмякай сюда] и т.д. А есть и чудесные кнопки, когда подставляете адрес нужной вам картинки, слова, флешки, сложные тексты и т.д. Например, простенькую кнопочку-картинку можно создать таким кодом: [more=<img src="АДРЕС КАРТИНКИ">]. Если хотите сделать четкое выравнивание по центру кнопки, четко строчкой ниже под текстом - в коде уточняйте это, например, так: [more=<center><br />Интересно? Тогда <br /><img src="АДРЕС КАРТИНКИ" /></center>]
Будет видно так:
Интересно? Тогда

А также можно сделать картинку плюс текст, несколько картинок, бегающие буквы, флешки, картинки с выравниванием и подписью и т.д. Под катом их много, смотрите и берите себе с готовым кодом вставки more=


Читать далее

Пишется это так:
<center>[more=<img src="//img0.liveinternet.ru/images/attach/c/2//70/855/70855532_blu_1.gif" /><br /> Читать далее]</center>




Пишется это так:
<center>[more=<img src="//img1.liveinternet.ru/images/attach/c/1//57/48/57048239_111.gif" /><br /> <img src="//img1.liveinternet.ru/images/attach/c/1//57/48/57048255_112.gif" />]</center>


Если не умеете смотреть адрес картинки, можете просто сохранить понравившуюся картинку себе на компьютер, затем загрузите ее и получившийся код вставьте в код кнопки. Вот так примерно будет выглядеть загруженная вами картинка:
<img src="//img1.liveinternet.ru/images/attach/c/3/75/555/75555153_strelka.gif" />

Вот примерно так должно получиться, когда вставите картинку в код "Далее":
[more=<center><img src="//img1.liveinternet.ru/images/attach/c/3/75/555/75555153_strelka.gif" /></center>]


Картинку "Читать далее" можно вставить сверху на любой фон, таким образом формируя картинку на чем угодно, сверху или сбоку или по центру. Например, вот так:

[more=<center><div style="background-image: url('АДРЕС КАРТИНКИ-ФОНА'); width:ШИРИНА НАПР.370px; height:ВЫСОТА НАПР.156px; "><center><p align="ПОЛОЖЕНИЕ ПОДПИСИ НАПРИМЕР СПРАВА ПО-АНГЛИЙСКИ right"> <img src="АДРЕС КАРТИНКИ-ДАЛЕЕ" /><p></center></div></center>]

Оптимальные картинки-далее в этом случае лучше сделать с подводкой букв, например:
далее1 (156x50, 9Kb)
далее2 (156x50, 21Kb)
ДАЛ (200x170, 113Kb)


0001 (253x55, 21Kb) 0002 (256x73, 38Kb) 0003 (235x65, 26Kb) 0004 (220x64, 19Kb) 0005 (250x56, 21Kb) 0006 (248x69, 23Kb) 0008 (290x79, 17Kb) 0009 (292x69, 18Kb) 0010 (371x125, 47Kb) 0011 (201x74, 20Kb) 0012 (283x137, 113Kb) 0013 (283x137, 61Kb) 0014 (283x137, 46Kb) 0015 (252x100, 23Kb) 00077 (293x117, 60Kb)

И вот еще два вида кнопочек, которые видятся НЕ во всех браузерах, например Опера у меня видит без проблем полукруглое обрамление, а Эксплоэр - нет. А у вас как с двумя кнопками ниже, как они видятся?
Кнопка-1 Внимание!!!У кнопки ниже Опера видит, а Эксплоэр НЕ видит полукруглого обрамления!!!
Читать далее

Пишется это так:
<center>[more=<div style="border-right: white 2px solid; padding-right: 4px; border-top: white 2px solid;padding-left: 3px; font-size: 92%; padding-bottom: 4px; border-left: white 2px solid; color:white; padding-top: 2px; border-bottom: white 2px solid; background-color:white"> <div style="border-radius:20px; box-shadow:-4px -4px 12px gray, 6px 6px 10px gray;background-repeat: repeat-x;"><div style="font-family:areal;color:black;font-size:17px; padding:10px 30px 10px 30px; "> <center> Читать далее </center> </div></div></div>]</center>


Кнопка-2. Внимание!!!У кнопки ниже Опера видит, а Эксплоэр НЕ видит полукруглого обрамления!!!

Читать далее

Пишется это так:
<center>[more=<div style="border-right: white 2px solid; padding-right: 4px; border-top: white 2px solid;padding-left: 3px; font-size: 92%; padding-bottom: 4px; border-left: white 2px solid; color:white; padding-top: 2px; border-bottom: white 2px solid; background-color:white"> <div style="border-radius:20px; box-shadow:-4px -4px 12px gray, 6px 6px 10px gray;background-repeat: repeat-x;"><div style="font-family:areal;color:black;font-size:17px; padding:10px 30px 10px 30px; "> <center> Читать далее </center> </div></div></div>]</center>



Серия сообщений "Кодировщик":
Шрифты, кнопки и прочее оформление

Часть 1 - Оформление днева (разные сайты и генераторы)
Часть 2 - Дизайн сообщений днева с принтскрином
...
Часть 20 - Знаки и символы
Часть 21 - Новостная бегущая строка для дневника, сайта
Часть 22 - Далее (текст под кат) Читать (смотреть) далее
Часть 23 - Редкие символы с тегом написания
Часть 24 - Шрифты (надеюсь ваш браузер отображает все перечисленные)
...
Часть 32 - Фильтруем (убедитесь, что ваш браузер видит тени букв)
Часть 33 - Тень у рамки
Часть 34 - Читать закрытые записи


Рубрики:  ВСЕ ДЛЯ БЛОГА И ДНЕВНИКА/кнопки ДАЛЕЕ
Метки:  

 

Добавить комментарий:
Текст комментария: смайлики

Проверка орфографии: (найти ошибки)

Прикрепить картинку:

 Переводить URL в ссылку
 Подписаться на комментарии
 Подписать картинку