Как сделать окантовку текста в css
Перейти к содержимому

Как сделать окантовку текста в css

  • автор:

Как сделать рамку вокруг таблицы?

Рамка вокруг таблицы устанавливается с помощью стилевого свойства border, оно добавляется к селектору table . Через border можно одновременно задать толщину, цвет и стиль рамки. В примере 1 показано создание рамки толщиной два пикселя.

Пример 1. Рамка вокруг таблицы

Рамка

Леонардо 5 8
Рафаэль 4 11
Микеланджело 24 9
Донателло 2 13

Результат данного примера показан на рис. 1.

Вид рамки

Рис. 1. Вид рамки

См. также

  • border
  • Блочные элементы
  • Добавление треугольника
  • Колесо для сокращённых свойств
  • Открываем блочную модель
  • Оформление ссылок
  • Повёрнутые рамки
  • Рамка вокруг изображений
  • Свойство border
  • Строчные элементы

Как добавить рамку вокруг кнопки?

Кнопки создаются с помощью элементов или , при этом вид кнопки меняется от браузера к браузеру. Если задать цвет фона у кнопки через свойство background-color (или background), то к кнопке автоматически добавляется трёхмерная рамка. Чтобы получить одинаковый вид в разных браузерах, для селектора button следует убрать рамку через свойство border со значением none или, наоборот, добавить свою рамку через то же свойство.

В примере 1 показана исходная кнопка, кнопка с цветным фоном, кнопка без рамки, кнопка с фоном и рамкой.

Пример 1. Цветная кнопка

Вид кнопок показан на рис. 1.

Вид кнопок в браузере

Рис. 1. Вид кнопок в браузере

См. также

  • background-color
  • border
  • Атрибут bgcolor
  • Блочные элементы
  • Добавление треугольника
  • Колесо для сокращённых свойств
  • Открываем блочную модель
  • Оформление ссылок
  • Повёрнутые рамки
  • Рамка вокруг изображений
  • Свойство border
  • Строчные элементы
  • Фон в CSS

Как сделать рамки в таблице html

Чтобы оформить границы ячеек таблицы, достаточно применить CSS свойство border .

   Наименование Кол-во   Груши 10   Яблоки 7   Мандарины 5   
table, td, th  /* задаем границу для всех элементов */ border: 3px solid #245488; > td, th  /* делаем отступ в ячейках, выставляем выравнивание текста */ padding: 10px 20px; text-align: center; > 

no-collapse

Результат:

На рисунке выше видно, что граница «задвоилась», так как css свойство border применяется к каждому элементу таблицы — и к table, и к каждому th/td. Для того, чтобы «схлопнуть» такие границы достаточно применить свойство border-collapse .

table, td, th  border-collapse: collapse; border: 3px solid #245488; > 

collapsed

Результат:

CSS: как обводку текста сделать жирнее?

Делаю обводку текста с помощью text-shadow. Можно ли её сделать жирнее? У box-shadow есть отдельный параметр, отвечающий за жирность, а у text-shadow — только за размытие. Его увеличение желаемого эффекта не даёт. Подскажите, какие могут быть варианты?

ОБВОДКА ТЕКСТА

Отслеживать

задан 15 июн 2018 в 9:50

humster_spb humster_spb

13.5k 4 4 золотых знака 24 24 серебряных знака 49 49 бронзовых знаков

желаемый эффект надо показывать

15 июн 2018 в 10:18

на svg не вариант ?

15 июн 2018 в 10:47

@МаксимЛенский, я просто svg не владею — если Вы покажете, как это будет выглядеть, возможно, подойдёт

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *