font-size css
12.08.2022

Как задать размер шрифта с помощью css свойства font-size

Чтобы задать размер шрифта на сайте с помощью css, необходимо у нужного элемента прописать свойство font-size. При этом размер шрифта можно указать несколькими способами:

Читать далее

8436
Как выровнять текст по горизонтали и вертикали в блоке div с помощью css
22.01.2022

Как выровнять текст по горизонтали и вертикали в блоке div с помощью css

Казалось бы, простая задача: выровнять текст по центру блока div. Присваиваем блоку свойство text-align:center и всего делов. Но как быть, если блок объемный и текст необходимо выровнять не только по горизонтали, а еще и вертикали? Конечно, можно задать padding в процентах для решения этой задачи. Но выравнивание в этом случае все - равно будет сбиваться. И тогда на помощь придет чудесные css свойства display:flex, display:table-cell и line-height.

Читать далее
5038
css затемнение фона
02.08.2020

Как сделать css затемнение фона

Всем привет. На связи coderistu.ru

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

Читать далее

7591
как сделать видео фоном сайта или блока
22.07.2020

Видео на задний фон сайта или блока

Видео на заднем фоне сайта или рекламного блока несомненно привлечет внимание пользователей к товару или услуге, которую оно представляет: динамичная картинка всегда смотрится намного лучше статики. И если, заглянув сюда, вы думаете, что сделать это очень сложно, то спешу вас обрадовать: процесс создания видео - бэкграунда очень простой и потребует минимального вмешательства в код.

Читать далее

5013
как сделать тень на сайте
06.05.2020

Как сделать тень блока на сайте с помощью css

Чтобы сделать css тень на сайте для текста или какого - либо блока, необязательно прибегать к помощи Adobe Photoshop. Для этого достаточно использовать css - свойства text - shadow и box - shadow, которые помогут добавить красивую тень куда угодно: к изображениям и фото, к слову, букве, абзацу, блоку или виджету. Тени, сделанные с помощью css, можно комбинировать, создавая красивые переливы и градиенты у объектов, к которым они применяются. Так же можно регулировать прозрачность тени, размах, размытие и смещение по осям X и Y.

Читать далее

4500
Как выровнять div блок по центру документа
17.11.2019

Как выровнять блок div по центру страницы

Казалось бы, тривиальная задача:  выровнять блок <div> по центру страницы с помощью css. Но на первых этапах изучения html и сss может серьезно озадачить начинающего веб - мастера. Сам сталкивался с такой проблемой, когда пытался выровнять <div> на макете сайта, когда только начинал изучать веб - программирование. Что и послужило началом для написания этой статьи.)

Читать далее

5360
как сделать сайт
22.09.2018

Как быстро сделать сайт? Инструкция.

Как быстро сделать простой, но в тоже самое время полноценный сайт за пару часов? Без использования готовых шаблонов и систем управления контентом?

Для тех, кто только начал знакомиться с азами верстки, эта задача покажется очень сложной, но на самом деле создать небольшой веб - ресурс на несколько страниц можно очень быстро. При этом знаний и опыта программирования на php, javascript или jquery не понадобится, т. к. сайт будет полностью построен на базе html и css.

Читать далее

2422
кликабельная ссылка на телефон
24.08.2018

Кликабельная ссылка на телефон. Как сделать ее на сайте

Согласно статистике, 70% пользователей заходят на сайты с мобильных устройств, поэтому конверсия современной интернет- страницы напрямую зависит от того, насколько она оптимизирована под мобильный трафик. И одной из важных составляющих является кликабельная ссылка на телефон, при нажатии на которую телефон переходит в режим звонка.

Если у вас есть сайт - одностраничник, сайт - визитка или интернет - магазин и им неудобно пользоваться на смартфонах и планшетах, то с 90% вероятностью человек уйдёт на другой ресурс, который лучше оптимизирован под мобильные устройства.

Читать далее

3291
css ленточка
19.08.2018

CSS ленточка

Рано или поздно практически каждый веб-мастер, глядя на свой сайт, приходит к мысли: "А вот в этом месте классно бы смотрелась какая - нибудь красивая ленточка". После чего приступает к реализации задуманной идеи.

Кто-то начинает рисовать ленту в фоторедакторе, а кто-то вспоминает, что быстрее, а главное, удобней, сделать такую ленту посредством css. Почему удобней? Потому что css ленточка быстро редактируется, масшатбируется и изменяется в размерах по мере необходимости.

При этом сам процесс рисования  css ленточки довольно простой и не занимает много времени.

Читать далее

5211