Создать кривую обводку текста в CSS сайта
 | |
| Это как заметка для веб мастера, что под любое описание можно создать обвод элемента, где полностью регулируется на CSS стилях под дизайн. Просто иногда замечаешь на интернет ресурсе, что написано, но ели заметно, хотя это заголовок, то здесь можно создать под него оформление и сразу после этого совершенно по другому визуально смотрится. Нужно заметить закругление углов, что на 3 пикселя сделаны, здесь можно полностью закруглить или оставить с углами, все по своему интернет ресурсу, под него основная стилистика используется. Не стал искать в сети, с одного сайта взял стандартную и потом добавил стилей, так как все делалось на темном фоне. Где всегда небольшие тени пригодятся, если для светлого, то их можно убрать. Сам обвод выставлен на один пиксель и немного прибавлено белого оттенка, чтоб приобрел вид. В нем можно сделать полноценное описание на главной или категорию, или поставить под функций и прописать ссылку на переход. И так начнем.  С начало в нужное место ставил код с вашим описанием. Код <div class="eTitle_zornet" style="text-align:left;">Шаблон cinemahits скачать</div> Если под ссылку, то добавляем на переход. Код <div class="eTitle_zornet" style="text-align:left;"><a href="Ссылка">Шаблон на сайте ZorNet.Ru</a></div> В CSS стили ставим, где и будем редактировать. Код .eTitle_zornet{ font-family: Verdana,Arial,Sans-Serif; font-size: 13px; font-weight: bold; color: #e6e5e4; padding: 10px 0px 10px 10px; background: #131212; border: 1px solid #8c8c8c; border-radius: 3px; box-shadow: 0px 8px 11px rgba(148, 148, 148, 0.31), 0px 7px 14px 8px rgba(0, 0, 0, 0); } Где этот стиль отвечает за тени, что можно отдельно потом на другие элементы ставить. Код box-shadow: 0px 8px 11px rgba(148, 148, 148, 0.31), 0px 7px 14px 8px rgba(0, 0, 0, 0); В стилях установлен отступ, что создает класс padding, это всегда пригодится, подробно читаем в этой статье, где по этой теме все описано. | |
Поделиться в социальных сетях
Материал разместил
| Комментарии: 0 | |