Border solid 1px black: border:1px solid black; · GitHub — Вебджем.рф | Создание и продвижение сайтов

Содержание

Свойство пограничного блока CSS

❮ Предыдущий Полное руководство по CSS Далее ❯

Пример

Установить стиль, цвет и ширину границ для разных элементов в направлении блока:

h2 {
border-block: 5px сплошной красный цвет;
}

h3 {
бордюрный блок: 4 пикселя с синими точками;
}

div {
граница-блок: двойной;
}

Попробуйте сами »

Определение и использование

Свойство border-block является сокращенным свойством для следующих свойств:

border-block-width
бордюрный блок (обязательно)
цветной бордюр

Если значения цвета или ширины опущены, будут использоваться значения по умолчанию.

УС Свойство border-block очень похоже на свойство CSS. граница , но свойство border-block зависит от направления блока.

Примечание: Связанное свойство CSS режим записи определяет направление блока. Это влияет на то, где находится начало и конец блока, а также на результат свойства border-block . Для страниц на английском языке линейное направление — слева направо, а блочное направление — вниз.

Показать демо ❯

Значение по умолчанию:	средний нет цветной
Унаследовано:	нет
Анимация:	да, см. отдельные свойства . Читать про анимированный Попробуй
Версия:	CSS3
Синтаксис JavaScript:	объект .style.borderBlock=»штрих ярко-розовый 10px» Попробуй

Поддержка браузера

Числа в таблице указывают первую версию браузера, которая полностью поддерживает это свойство.

Собственность
пограничный блок	87,0	87,0	66,0	14,1	73,0

Синтаксис CSS

border-block: border-block-width border-block-style border-block-color |initial|inherit;

Значения свойств

Значение	Описание	Демо
ширина блока	Задает ширину границы в направлении блока. Значение по умолчанию «средний»	Демонстрация ❯
бордюрный блок	Задает стиль границы в направлении блока. Значение по умолчанию — «нет»	Демонстрация ❯
бордюр-цвет	Указывает цвет границы в направлении блока. Значение по умолчанию — цвет текст	Демонстрация ❯
начальный	Устанавливает для этого свойства значение по умолчанию. Читать про начальный
унаследовать	Наследует это свойство от родительского элемента. Читать о унаследовать

Другие примеры

Со свойством режима письма

На положение границ в начале и конце блока влияет свойство режима письма :

div {
режим письма: вертикальный -рл;
граница блока: ярко-розовый пунктир 8 пикселей;
}

Попробуйте сами »

Связанные страницы

Учебник CSS: Граница CSS

Свойство границы CSS: Свойство границы CSS

Свойство границы CSS: цвет блока CSS: Свойство цвета блока CSS

Свойство CSS border-block-style: CSS свойство Border-block-style

CSS свойство border-block-width: CSS свойство Border-block-width

CSS свойство write-mode: CSS свойство Write-mode

❮ Предыдущий Полное руководство по CSS Следующий ❯

ВЫБОР ЦВЕТА

Лучшие учебники

Учебное пособие по HTML
Учебное пособие по CSS

Учебное пособие по JavaScript
Учебное пособие
Учебное пособие по SQL
Учебное пособие по Python
Учебное пособие по W3.

CSS
Учебник по Bootstrap
Учебник по PHP
Учебник по Java
Учебник по C++
Учебник по jQuery

Лучшие ссылки

HTML Reference
CSS Reference
JavaScript Reference
SQL Reference
Python Reference
W3.CSS Reference
Bootstrap Reference
PHP Reference
HTML Colors
Java Reference
Angular Reference
jQuery Reference

4 Top6s Примеры HTML
Примеры CSS
Примеры JavaScript
How To Примеры
Примеры SQL
Примеры Python
Примеры W3.CSS
Примеры Bootstrap
Примеры PHP
Примеры Java
Примеры XML
Примеры jQuery

FORUM | О

W3Schools оптимизирован для обучения и обучения. Примеры могут быть упрощены для улучшения чтения и обучения. Учебники, ссылки и примеры постоянно пересматриваются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность всего содержания.

Используя W3Schools, вы соглашаетесь прочитать и принять наши условия использования, куки-файлы и политика конфиденциальности.

html — Проблемы с получением границы в 1 пиксель для таблицы с использованием CSS

Задавать вопрос

спросил 11 лет, 8 месяцев назад

Изменено 10 лет, 9 месяцев назад

Просмотрено 18 тысяч раз

Я перепробовал множество комбинаций, но не могу получить простую рамку шириной 1 пиксель для всех ячеек и окружения таблицы. Вот что у меня есть:

 table.admin { border-collapse:collapse; }
таблица.admin,
table.admin тд,
table.admin th {граница: 1px сплошная #BBB; отступ: 5px; }
table. admin td { text-align:left; }
table.admin th {цвет фона: #BBB; вес шрифта: 400; }
<таблица>
    
  
    СтрокаСтрока
  
  
    abcabc
  
      
    abcabc

Это выглядит очень просто, НО я получаю таблицу, в которой нижняя граница каждой строки составляет 2 пикселя.

Я попробовал это в скрипке. Там все выглядит нормально, но не на моей странице. Я полностью запутался, так как внизу каждой строки все еще есть эта граница в 2 пикселя. Я просто не понимаю, почему.

У кого-нибудь есть предложения? Все, что я хочу, это видеть ячейки с красивой границей в 1 пиксель, которая выглядит одинаково вокруг каждой ячейки. Обратите внимание, что это хорошо выглядит в скрипке, так почему бы и нет в моем браузере Firefox 🙁

Вот еще пример. Я просто добавил на свою страницу. Я использовал другое имя класса, чтобы быть уверенным, что ничего не унаследовано из другого места: