Очистка блоков в CSS

[D Ash]

      

Только для владельцев платный аккаунтов с подключенным CSS.

      

Идея проста. Вам нужна какая-либо ссылка, которая присутствует в дневнике, но вам совсем не нужен текст в ней - вы хотите иконку. Как это сделать?

      

1. Найдите ID данного объекта. Чтобы было, по чему обращаться к нему в CSS.

      

2. Создайте \ выберите \ найдите иконку. Закиньте её в БИ, запомните размеры (дальше - X и Y).

      

3. Примените следующий стиль для данного объекта: "{width:Xpx; height:1px; padding-top:Ypx; clip:rect(0px Xpx Ypx 0px); background:url('ссылка/на/изображение/в/вашей/БИ') no-repeat;}". Если что-то не сработает, добавьте перед ";" данного параметра "!important".

      

Суть в том, что мы просто вытесняем текст (с помощью padding-top) и обрезаем его (через clip). Таким образом можно сделать полностью графическое меню или вообще весь интерфейс, что привлекает, верно?

      

Пример можно посмотреть в одном из моих дневников, здесь. Ссылка, ведущая к якорю у верха страницы.

@темы: Дневник, Платные сервисы, Оформление дневника, CSS

Comments

[bokonist]

как вы считаете, сколько из 347 031 читателя этого блога воспользуются вашим советом или найдут в нем что-то ценное?

[-Sofi-]

bokonist
во всяком случае это интересная информация. кому не надо - пролистают.

D Ash
Спасибо, что просвятили)
Дизайн у днева потрясающий! И масштабируется так круто... одинаково хорошо смотрится как на 12, так и на 24 дюймах.

[D Ash]

-Sofi-
Спасибо. )
Рад, что вам понравился. С полноправными записями ещё лучше будет - там галерея интересная. )

bokonist
Те, у кого подключен CSS и кому надоели стандартные дизайны. Ммм... Человек 50-100 навскидку. Не сразу, со временем, разумеется.

[.Vozduh]

D Ash, bokonist прав в том, что место вы выбрали неудачное.)) Тут это было бы в разы актуальней. Хотя там, наверняка, этот вопрос поднимался и не раз...
Здесь вы могли бы рассказать как сделали эпиграф. Мне было бы крайне интересно.
Немного о Комик Сансе

[D Ash]

Там не только эпиграф, но и вообще все записи в дневнике. Пока что говорить не буду - нет ни одной полноценной записи, соответственно, нет ни одной галереи, а там очень красивые галереи. На днях сделаю её, тогда и мануал напишу. Если кратко, то через многократный :hover.

По поводу Comic Sans'а - перебрал все остальные, мне визуально нравится только он и Courier New, но последний нечитаем. Хотя, потом, может, и изменю. Например, когда найду способ использовать сторонние шрифты.

[.Vozduh]

Здорово! Буду ждать.))

А шрифты... Можно же взять не только те что в списке на дайри. Consolas например. Он в отличии от Courier New читаем. )) Здесь подробней.

D Ash очень своевременная информация, мне сейчас надо как раз, спасибо!
было бы неплохо продублировать пост на "@CSS — стилизация дневников" - там то это точно нужнее)
Дизайн обалденный
обязательно буду следить за изменениями и мечтать скоро увидеть мануал
выплывающий эпиграф - это вообще прям! ну прям вообще!!!))))
очень-очень-очень хочется узнать как что вы там сделали) буду ждать

[Тайя.]

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

D Ash, спасибо за инфу)
Только поправьте тогда уж background:url ('ссылка/на/изображение/в/вашей/БИ') на background:url('ссылка/на/изображение/в/вашей/БИ'), все-таки это принципиально, если не очень опытный пользователь CSS воспользуется вашим советом, то он долго будет думать, почему у него не отображается картинка, а затык в пробеле после url

[dead_mockingbird]

Суть в том, что мы просто вытесняем текст (с помощью padding-top) и обрезаем его (через clip).

прятать текст гораздо удобнее через text-indent с большим отрицательным значением.

[La_mignonne]

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

с удовольствием почитаю

[D Ash]

mahini
Спасибо за ссылку. На днях почитаю, поставлю шрифт поприличнее, да. )

маньяк-извращенец
Рад, что вам понравился дизайн. )
Мануал на следующей неделе будет.

Тайя, которая душит романтиков
Поправил. Спасибо, что заметили. )

dead_mockingbird
В данном случае не удобно. Не удобно, т.к. необходимо учитывать количество содержимого блока. Данная же формула универсальна.

La mignonne
^_^

[Bernadett-e]

спасибо, мне оказалось полезно.

[D Ash]

Беатрикс
)