Поговорим о бордюрах.

Среда, 18 Февраля 2026 г. 22:11 + в цитатник

Цитата сообщения tomishka

Прочитать целиком В свой цитатник или сообщество!

Перед вами скелетик четырехслойной рамочки, которым предложила пользоваться блогер bloginja. В этом скелетике я вместо нулевых бордюров взяла бордюры шириной 2px. Что такое БОРДЮР? Это узенькая полоска серого цвета окаймляющая КАЖДЫЙ фон, если, конечно, там стоит значение отличное от нуля. Если взять значение, например, в 6px, то вид фона с таким окаймлением будет непривлекательным. Только поэтому либо указывают нулевое значение, либо ширина берется в 2px.

СОДЕРЖИМОЕ РАМКИ

Перед вами рамочка ( картинка ), на которой видны бордюры в виде тонких линий серого цвета, они окаймляют каждый фон. Пока в скелетике я указала только следующие значения: адреса двух фонов ( первого и третьего ), они одинаковые шириной 5px, у второго фона указала его ширину в 45px для наглядности. Содержимое рамки заменила картинкой, а под текст оставила поле в 600px.

А вот таким будет изображение, если внешний бордюр будет шириной 10px. Подберем два подходящих фона и сделаем ВСЮ рамочку шириной в 700px.

Теперь разберемся, где и какие значения надо изменить, чтобы рамка была шириной в 700 px. Две широких полоски, каждая 45px, четыре узенькие полоски по 5px, восемь бордюрных полосок по 2px, итого 126px. Значит ширина картинки не может быть больше 574px, а чтобы текст не наезжал, поле под него должно быть еще немного меньше, например, 550. Причем отступ для самого внутреннего слоя сделать надо нулевым.

Здесь будет ваш текст

Серия сообщений "♦ от tomishka":
Часть 1 - Снова о простейших рамочках. Лидочка, сердечно благодарю!
Часть 2 - Продолжим тему о простейших рамочках.
...
Часть 34 - Учимся делать рамки
Часть 35 - Полезная информация
Часть 36 - Поговорим о бордюрах.
Часть 37 - Пост для желающих экспериментировать
Часть 38 - Рамочки для текста
Часть 39 - Изучаем тени
Часть 40 - Очередной эксперимент

Метки: делаем рамочку от tomishka
Понравилось: 7 пользователям

<a href="https://www.liveinternet.ru/users/e_ledi/post514453055/">РџРѕРіРѕРІРѕСЂРёРј Рѕ Р±РѕСЂРґСЋСЂР°С….</a><br/>
РџРµСЂРµРґ РІР°РјРё СЃРєРµР»РµС‚РёРє С‡РµС‚С‹СЂРµС…СЃР»РѕР№РЅРѕР№ СЂР°РјРѕС‡РєРё, РєРѕС‚РѕСЂС‹Рј РїСЂРµРґР»РѕР¶РёР»Р° РїРѕР»СЊР·РѕРІР°С‚СЊСЃСЏ Р±Р»РѕРіРµСЂ bloginja. Р’ СЌС‚РѕРј СЃРєРµР»РµС‚РёРєРµ СЏ РІРјРµСЃС‚Рѕ РЅСѓР»РµРІС‹С… Р±РѕСЂРґСЋСЂРѕРІ РІР·СЏР»Р° Р±РѕСЂРґСЋСЂС‹ С€РёСЂРёРЅРѕР№ 2px. Р§С‚Рѕ С‚Р°РєРѕРµ Р‘РћР Р”Р®Р ? РС‚Рѕ СѓР·РµРЅСЊРєР°СЏ РїРѕР»РѕСЃРєР° СЃРµСЂРѕРіРѕ С†РІРµС‚Р° РѕРєР°Р№РјР»СЏСЋС‰Р°СЏ РљРђР–Р”Р«Р™ С„РѕРЅ, РµСЃР»Рё, РєРѕРЅРµС‡РЅРѕ, С‚Р°Рј СЃС‚РѕРёС‚ Р·РЅР°С‡РµРЅРёРµ РѕС‚Р»РёС‡РЅРѕРµ РѕС‚ РЅСѓР»СЏ. Р•СЃР»Рё РІР·СЏС‚СЊ Р·РЅР°С‡РµРЅРёРµ, РЅР°РїСЂРёРјРµСЂ, РІ 6px, С‚Рѕ РІРёРґ С„РѕРЅР° СЃ С‚Р°РєРёРј РѕРєР°Р№РјР»РµРЅРёРµРј Р±СѓРґРµС‚ РЅРµРїСЂРёРІР»РµРєР°С‚РµР»СЊРЅС‹Рј. РўРѕР»СЊРєРѕ РїРѕСЌС‚РѕРјСѓ Р»РёР±Рѕ СѓРєР°Р·С‹РІР°СЋС‚ РЅСѓР»РµРІРѕРµ Р·РЅР°С‡РµРЅРёРµ, Р»РёР±Рѕ С€РёСЂРёРЅР° Р±РµСЂРµС‚СЃСЏ РІ 2px.
РЎРћР”Р•Р Р–РРњРћР• Р РђРњРљР
РЎРћР”Р•Р Р–РРњРћР• Р РђРњРљР
РџРµСЂРµРґ РІР°РјРё СЂР°РјРѕС‡РєР° ( РєР°СЂС‚РёРЅРєР° ), РЅР° РєРѕС‚РѕСЂРѕР№ РІРёРґРЅС‹ Р±РѕСЂРґСЋСЂС‹ РІ РІРёРґРµ С‚РѕРЅРєРёС… Р»РёРЅРёР№ СЃРµСЂРѕРіРѕ С†РІРµС‚Р°, РѕРЅРё РѕРєР°Р№... <a href="https://www.liveinternet.ru/users/e_ledi/post514453055/">Р§РёС‚Р°С‚СЊ РґР°Р»РµРµ...</a>

« Пред. запись — К дневнику — След. запись »

Страницы: [1] [Новые]

LiveInternetLiveInternet

-Рубрики

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

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

-Друзья

-Статистика

Поговорим о бордюрах.