Перейти к содержанию
  • записей
    18
  • комментариев
    0
  • просмотров
    2209

О блоге

Полезности всякие тут будут... HTML, CSS, JS, PHP и прочее что встретится на моем пути в этом направлении! Постить буду, как найденные решения других людей, так и свои... 

Записи в этом блоге

HTML список в несколько колонок с помощью CSS - простой способ

Для того чтобы вывести стандартный список <ul><li></li>....</ul> - маркированный или  <ol><li></li>....</ol> - нумерованный список в несколько колонок достаточно прописать к нему в CSS стили:  ul {   list-style-position: inside;   -moz-column-count: 3;   -webkit-column-count: 3;   column-count: 3; } До: Пункт списка 1 Пункт списка 2 Пункт списка 3 Пункт списка 4 Пункт списка 5 Пункт списка 6 Пун

Печенег

Печенег в CSS

Убрать браузерную обводку по клику на кнопке <button>, <input>, <a> или на <textarea>.

:focus { outline: none !important; } ::-moz-focus-outer, ::-moz-focus-inner { border: 0px !important; padding: 0; } a:focus, a:active, button:focus { outline: 0!important; outline-color: transparent!important; outline-width: 0!important; outline-style: none!important; box-shadow: 0 0 0 0 rgba(0,123,255,0)!important; } input, textarea, input:active, textarea:active { outline:none; } input[type="checkbox"]:focus, input[type="radio"]:focus { visibility: hidden; }  

Печенег

Печенег в CSS

Картинки (изображения) в строке (ряду) одной высоты css используя object-fit.

Есть 4 картинки разного размера:   HTML <div class="row img-gallery"> <div class="col-md-3 col-12"> <img src="img-1.webp" alt="Картинка 1" /> </div> <div class="col-md-3 col-12"> <img src="img-2.webp" alt="Картинка 2" /> </div> <div class="col-md-3 col-12"> <img src="img-3.webp" alt="Картинка 3" /> </div> <div class="col-md-3 col-12"> <im

Печенег

Печенег в CSS

Поменять местами div блоки вертикально. Flexbox CSS.

Краткая заметка по вертикальной смене порядка блоков <div> и других элементов документа html: Поддержка браузерами   HTML <div class="group_block"> <div class="block_1">1й элемент</div> <div class="block_2">2й элемент</div> <div class="block_3">3й элемент</div> </div> CSS .group_block { display: flex; flex-direction: column; /* flex-direction: column-reverse; /* Включает обратный порядок */

Печенег

Печенег в CSS

Общий чат

Введите ваше имя

×
×
  • Создать...

Важная информация

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