17:16 

Разделители.

Кареглазый Демон
Ко мне на "ВЫ", шепотом и с придыханием...
Возможность прописать кодом разделители это еще один повод подключить CSS)
Отдельного селектора, отвечающего за пространство между постами и комментариями не существует. Зато можно задавать фон самого поста.
Если бэкграунд повторяющийся получится заливка. Текстурой, полупрозрачной подложкой или просто цветом по вашему желанию.
А если прописать картинку без повторения и задать ей положение по краю поста она прилепится справа, слева, сверху или внизу. Последние два случая как раз используются для имитации разделителей.
Конечно можно и в бесплатнике исхитриться. Допустим прописав нужный код с картинкой через сервис настраиваемых кнопок. Но в этом случае вам придется жать на кнопку вручную в конце каждого поста. А если страниц в вашем дневнике много пере сохранять ранние посты вы просто замучаетесь.

Сам код очень простой. Даже не нужно прописывать ширину и высоты картинки.

Обратите внимание что вставлять нужно не весь адрес изображения из БИ, а начиная с /userdir и до конца.
Расшифровка:
каждый пост {(картинка) не повторять; позиция внизу; отступ снизу; отступ сверху}
Отступы нужны чтобы ваш разделитель вышел за сам пост и не перекрывал ссылки под постом.
Когда вы прописываете код таким образом возникает небольшой глюк, а именно двоится разделитель под эпиграфом.
Убирается это вот так:


Конечный код:


Ну и чтобы вам было на чем тренироваться.
РАЗДЕЛИТЕЛИ

Авторство не мое, я только подогнал под размер. Найдено в открытых источниках.

Вопрос: Полезно?
1. Да 
31  (100%)
2. Нет 
0  (0%)
Всего: 31
Всего проголосовало: 31

@темы: урок, как это сделано, возможности CSS, Кареглазый Демон, CSS

Комментарии
2017-12-03 в 19:11 

Kai Noir
Ранимый эстет
спасибо)) было интересно почитать и полезно)

2017-12-03 в 19:21 

Кареглазый Демон
Ко мне на "ВЫ", шепотом и с придыханием...
SoraNoir, всегда пожалуйста)

2017-12-03 в 23:23 

Bacca.
Рано или поздно, так или иначе
Ух ты! сейчас попробую.
А много в соо таких постов поучающих? Может уже все ответы на мои вопросы есть))

2017-12-03 в 23:28 

Кареглазый Демон
Ко мне на "ВЫ", шепотом и с придыханием...
Bacca., пробуйте)
А много в соо таких постов поучающих? немного, но они есть)
Можно найти по тегу "как это сделано", ссылке Уроки в выпадающем меню и по уроки CSS и не только эпиграфа. Или напрямую originaldesign.diary.ru/?tag=2594826

2017-12-03 в 23:54 

Bacca.
Рано или поздно, так или иначе
Получилось)) только я для пробы взяла из тех, что в посте, но он все равно моему фону не подходит. Надо будет сделать себе другой.
А еще лучше бы фон заменить одной картинкой. Поищу, может где-то уже рассказывается.

2017-12-03 в 23:56 

Кареглазый Демон
Ко мне на "ВЫ", шепотом и с придыханием...
Bacca., а вы выберите в стандартных настройках не табличный а блочный дизайн. Лучше сядет.
А еще лучше бы фон заменить одной картинкой. вроде еще нет. Но вам там по тегу попадется пост для заявок на уроки. Можете оставить свою и я напишу урок.

2017-12-03 в 23:59 

Bacca.
Рано или поздно, так или иначе
В том и дело, что блочные мне не нравятся, я люблю когда все меню видно, и оно слева.
А как сделать отступ вообще без картинки?, вот как здесь,

2017-12-04 в 00:17 

Кареглазый Демон
Ко мне на "ВЫ", шепотом и с придыханием...
как сделать отступ вообще без картинки?, вот как здесь,
Также, только без картинки)
И цифрами регулировать пустое пространство.

2017-12-04 в 00:20 

Bacca.
Рано или поздно, так или иначе
О, я как раз так и сделала, убрала картинку просто. Спасибо!

2017-12-04 в 00:25 

Кареглазый Демон
Ко мне на "ВЫ", шепотом и с придыханием...
Bacca., пожалуйста)

2017-12-08 в 22:49 

Наблюдатель*
У фантазий лишь один недостаток - слишком часто выбрасывает в реальный мир
Спасибо за красивости! Не как разделители, но парочку утащила для создания настроения в дневник. ))

2017-12-08 в 22:58 

Кареглазый Демон
Ко мне на "ВЫ", шепотом и с придыханием...
Наблюдатель*, пожалуйста) Рад что пригодилось... так или иначе)

2018-01-27 в 15:46 

Нэко
🎇 fiel de miel 🎇
Огромное вам спасибо за урок!!! Интересно просто невероятно, я лишь дня четыре как открыла для себя возможности самОй делать ЦСС, а не устанавливать готовые по кнопочке, и теперь только что не верещу от восторга: ЭТО ТАК КРУТО *___* Всё делать и менять самОй! искоркиискоркиискорки Это правда просто… почти что волшебство какое-то *_* сИрдца

Правда пока что с разделителями ерунда полная получилась(( Совсем не так, как должно было быть.

Вот код моего дневника:



Вот я вставила разделитель в него, и код стал таким:



Но… Но на выходе получилось что-то совсем не радующее((( изображение
Вот скрин:


Есть ли возможность убрать разделитель из эпиграфа, оставив его тем не менее в остальных постах?

Хотя в постах он тоже как-то… неуместно смотрится, что ли. Скрин:
Я так поняла, что он должен был установиться ВМЕСТО этих чёрных полосочек, но получилось так, что он установился ОДНОВРЕМЕННО с ними(( Пока пойду, уберу, потом ещё поэкспериментирую.
Спасибо огромное вам! лайклайклайк

2018-01-27 в 15:57 

Нэко
🎇 fiel de miel 🎇
:ps: Я поковырялась и разобралась!!! Если убрать из моего кода вот эту строчку:

, то чёрные полоски исчезнут. Вот! *__* Но при этом разделитель точно так же перекашивает эпиграф, как на предыдущем моём скрине. То есть он там торчит посередине эпиграфа, увы, а не снизу, как надо бы( нельзя ли убрать разделитель из эпиграфа вовсе?((

2018-01-27 в 19:30 

Кареглазый Демон
Ко мне на "ВЫ", шепотом и с придыханием...
Нэко, то чёрные полоски исчезнут. селектор .postLinksBackg это область под ссылками внизу поста. Они близко к разделителю если он прописан в верхней части.
нельзя ли убрать разделитель из эпиграфа вовсе? можно
#epigraph { background:none!important;}

2018-01-27 в 19:40 

Нэко
🎇 fiel de miel 🎇
селектор .postLinksBackg это область под ссылками внизу поста. Они близко к разделителю если он прописан в верхней части.Кареглазый Демон, я не поняла эти Ваши слова, простите(( вопросвопросвопрос

Ух ты!!! Огромное спасибо за подсказку по эпиграфу! Огромнейшее спасибо)

2018-01-27 в 21:25 

Кареглазый Демон
Ко мне на "ВЫ", шепотом и с придыханием...
Нэко, это кусочек пространства позади ссылок url, u-mail, В цитатник, Дневник, Профиль, Поделиться.

2018-01-27 в 22:00 

Нэко
🎇 fiel de miel 🎇
Кареглазый Демон, не подумайте обо мне плохо, но я всё равно не поняла( Постараюсь разобраться позже, пока для меня это китайская грамота.

2018-01-28 в 13:55 

Кареглазый Демон
Ко мне на "ВЫ", шепотом и с придыханием...
Нэко, да ничего я такого и не думаю)

Комментирование для вас недоступно.
Для того, чтобы получить возможность комментировать, авторизуйтесь:
 
РегистрацияЗабыли пароль?

Original Designs бесплатники, CSS и уроки по созданию оформлений.

главная