Css стиль который убирает табличные пробелы

border-spacing

Задает расстояние между границами ячеек в таблице. border-spacing не работает в случае, когда для таблицы установлено свойство border-collapse со значением collapse .

Синтаксис

border-spacing: значение1 [значение2]

Значения

Одно значение устанавливает одновременно расстояние по вертикали и горизонтали между границами ячеек. Если значений два, то первое определяет горизонтальное расстояние, а второе — вертикальное.

HTML5 CSS 2.1 IE Cr Op Sa Fx

    border-spacing     1 2  
 3 4

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

Применение свойства border-spacing

Рис. 1. Применение свойства border-spacing

Как убрать пробелы между ячейками в HTML-таблице

Я пытаюсь удалить пустое пространство между Table1Header и Table2Header. Я попытался border: 0px, padding: 0px и border-spacing: 0px; стили. Firefox и Opera говорят мне, что мой стиль межстрочного интервала переопределяется стилем пользовательского агента (который равен 2px). Как заставить браузер использовать мои стилешиты? http://jsfiddle.net/cdjDR/2/

       Table1Header  
        Table1Col1 
  
 
  2  
 
 
 
 
  
 
 
     Table2Header  
        Table2Col1 
  
 
  12345  
 
 
 
 
  
 
 
  
 
 
 span.tableHeader > label < display: inline-block; float:left; line-height:30px; padding-left:10px; color: #202020; font-size: 13px; >tr.tableHeader < background-color: #EEEEEE; >table.tableGroup, table.tableGroup > tr > td > table < border-spacing: 0px; >table.tableGroup div.ui-datatable th > div > span >span.ui-header-text < color: #808080; font-size: 11px; >table.tableGroup td, table.tableGroup th

user3193136 14 янв. 2014, в 09:30
Поделиться

table < border-collapse: collapse; >, вероятно, то, что вам нужно. Но, тем не менее, -1 для этого беспорядка (даже если это всего лишь образец)!

Abhitalks 14 янв. 2014, в 08:22
Поделиться:
border-spacing

4 ответа

Лучший ответ

Браузеры не сообщают вам, что стиль border-spacing переопределяется таблицей стилей пользовательского агента. Вместо этого они могут указывать, что наследование не выполняется для него. Это просто связано с тем, что в какой-либо таблице стилей задается свойство элемента.

Причина, по которой ваше правило не применяется к внутреннему элементу table , заключается в том, что оно не соответствует ни одному из ваших селекторов. Селектор

table.tableGroup > tr > td > table

не соответствует этому, потому что элемент tr никогда не является дочерним элементом table , даже если это может показаться. По синтаксису HTML существует промежуточный элемент tbody , даже если его начальный и конечный теги отсутствуют. Следующий селектор будет соответствовать:

table.tableGroup > tbody > tr > td > table

Конечно, простой селектор table также выполнил бы работу, при условии, что вы хотите, чтобы все элементы table были написаны в соответствии с этим правилом.

Jukka K. Korpela 14 янв. 2014, в 10:05
Поделиться

Это лучше , если он использует table.tableGroup table , если он пытается свернуть границы всех вложенных таблиц . или даже лучше просто table <> , но в любом случае +1, я не сказал ему , что tbody было пропущено

Mr. Alien 14 янв. 2014, в 08:31

Вы можете просто использовать border-collapse: collapse; или даже border-spacing: 0; в порядке

table < /* Will apply to all tables */ border-spacing: 0; /* OR border-collapse: collapse; */ >

Вы можете легко переопределить таблицу стилей useragent с помощью простого селектора элементов.

Если вы хотите нормализовать стили, вы должны использовать CSS Reset

Переход к вашему селектору, который мне кажется грязным, поскольку вы нацеливаете таблицу на class .tableGroup и table , вложенные под этим

table.tableGroup, table.tableGroup > tr > td > table

Итак, вам лучше использовать

table.tableGroup, table.tableGroup table

2.8. CSS-таблицы

Спецификация CSS даёт неограниченные возможности для оформления таблиц. По умолчанию таблица и ячейки таблицы не имеют видимых границ и фона, при этом ячейки внутри таблицы не прилегают вплотную друг к другу.

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

Форматирование таблиц

Содержание:
1. Границы таблицы border
2. Как задать ширину и высоту таблицы
3. Как задать фон таблицы
4. Столбцы таблицы
5. Как добавить таблице заголовок
6. Как убрать промежуток между рамками ячеек
7. Как увеличить промежуток между рамками ячеек
8. Как скрыть пустые ячейки таблицы
9. Компоновка макета таблицы с помощью свойства table-layout
10. Лучшие макеты таблиц (Топ-10 таблиц)

1. Границы таблицы border

Таблица и ячейки внутри неё по-умолчанию отображаются в браузере без видимых границ. Границы таблицы задаются свойством border :

table < border-collapse: collapse; /*убираем пустые промежутки между ячейками*/ border: 1px solid grey; /*устанавливаем для таблицы внешнюю границу серого цвета толщиной 1px*/ >

Границы ячеек заголовка каждого столбца задаются для элемента th :

Границы ячеек тела таблицы задаются для элемента td :

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

th, td

Внешнюю границу таблицы можно выделить, задав ей увеличенную ширину:

table

Границы можно задавать частично:

/* устанавливаем для таблицы внешнюю границу серого цвета толщиной 3px */ table < border-top: 3px solid grey; >/* задаём для ячейки тела таблицы границу серого цвета толщиной 1px */ td

Подробнее о свойстве border вы можете прочитать здесь.

2. Как задать ширину и высоту таблицы

По умолчанию ширина и высота таблицы определяется содержимым её ячеек. Если ширина не задана, то она будет равна ширине самого широкого ряда (строки).

Ширина таблицы и столбцов задаётся с помощью свойства width . Если для таблицы задано table , то ширина таблицы будет равна ширине блока-контейнера, в котором она находится.

Ширину таблицы и столбцов обычно задают в px или % , например:

table < width: 600px; >th < width: 20%; >td:first-child

Фиксировать высоту с помощью свойства height не рекомендуется.

th, td

3. Как задать фон таблицы

По умолчанию фон таблицы и ячеек прозрачный. Если страница или блок, содержащие таблицу, имеют фон, то он будет просвечиваться сквозь таблицу. Если фон задан и для таблицы и для ячеек, то в местах наложения фона таблицы и ячеек будет виден фон только ячеек. В качестве фона для таблицы в целом и её ячеек могут выступать:

заливка сплошным цветом,
градиентная заливка,
фоновое изображение.

4. Столбцы таблицы

с помощью элемента можно задать фон для любого количества столбцов;
с помощью селектора table td:first-child , table td:last-child можно задать стили для первого или последнего столбца таблицы (за исключением первой ячейки заголовка таблицы);
с помощью селектора table td:nth-child(правило отбора столбцов) можно задать стили для любых столбцов таблицы.

Подробнее про элемент вы можете прочитать здесь.

Подробнее про CSS-селекторы вы сможете прочитать здесь.

5. Как добавить таблице заголовок

Добавить заголовок в таблицу можно с помощью элемента , а с помощью свойства caption-side его можно поместить перед таблицей или под ней. Для горизонтального выравнивания текста заголовка применяется свойство text-align .

caption-side
Значения:
top	Заголовок таблицы располагается над таблицей. Значение по умолчанию.
bottom	Располагает заголовок под таблицей.
initial	Устанавливает значение свойства в значение по умолчанию.
inherit	Наследует значение свойства от родительского элемента.

  .Таблица № 1 Company  Q1  Q2  Q3  Q4

caption

caption_side

6. Как убрать промежуток между рамками ячеек

Рамки ячеек таблицы по умолчанию разделены небольшим промежутком. Если задать для таблицы border-collapse: collapse , то промежуток уберётся.

border-collapse
Значения:
separate	Рамки ячеек располагаются раздельно.
collapse	Рамки ячеек сливаются в одну, а промежутки между рамками убираются.
initial	Устанавливает значение свойства в значение по умолчанию.
inherit	Наследует значение свойства от родительского элемента.

table

table_border_collapse

7. Как увеличить промежуток между рамками ячеек

С помощью свойства border-spacing можно менять расстояние между рамками ячеек. Данное свойство применяется к таблице в целом.

border-spacing
Значения:
	Добавляет промежутки между рамками как по вертикали, так и по горизонтали. Если заданы две длины, то первая всегда определяет горизонтальный промежуток, а вторая — вертикальный.
initial	Устанавливает значение свойства в значение по умолчанию.
inherit	Наследует значение свойства от родительского элемента.

table < border-collapse: separate; border-spacing: 10px 20px; >table

table_border_spacing

8. Как скрыть пустые ячейки таблицы

Свойство empty-cells скрывает или показывает пустые ячейки. Действует только на ячейки, которые не содержат какой-либо контент. Если для ячейки задан фон, а для таблицы задано table , то ячейка не будет скрыта.

empty-cells
Значения:
show	Рамка и фон пустой ячейки будут отрисовываться так же, как для ячейки таблицы, имеющей содержимое.
hide	Если все ячейки строки пусты, то вся строка отображается так, если бы было задано значение display: none .
initial	Устанавливает значение свойства в значение по умолчанию.
inherit	Наследует значение свойства от родительского элемента.

  Company  Q1  Q2  Q3  
 Microsoft  20.3  30.5  
 Google  50.2  40.63  45.23

Company	Q1	Q2	Q3
Microsoft	20.3	30.5
Google	50.2	40.63	45.23

table < border: 1px solid #69c; border-collapse: separate; empty-cells: hide; >th, td

table_empty

9. Компоновка макета таблицы с помощью свойства table-layout

Компоновка макета таблицы определяется одним из двух подходов: фиксированный макет или автоматический макет. Под компоновкой в данном случае подразумевается как распределяется ширина таблицы между шириной ячеек.

Свойство не наследуется.

table-layout
Значения:
auto	Значение по умолчанию. Ширина макета таблицы определяется шириной её содержимого с учетом значений свойств padding-left , padding-right , border-left width плюс одна ширина border-right последней ячейки в ряду, или заданной шириной ячеек и толщиной рамки. Если ширина ячеек не задана явно, они могут быть разной ширины.
fixed	Свойство сработает только в том случае, если для таблицы задана ширина. Ширина ячеек будет одинаковой, а содержимое ячеек, которое не помещается в ячейку, будет наползать под содержимое соседней ячейки.
initial	Устанавливает значение свойства в значение по умолчанию.
inherit	Наследует значение свойства от родительского элемента.

table

10. Лучшие макеты таблиц

По материалам статьи Top 10 CSS Table Designs из журнала Smashing Magazine

top-table

1. Горизонтальный минимализм

Горизонтальные таблицы — это таблицы, текст в которых читается по горизонтали. Каждая сущность представляет собой отдельную строку. Вы можете оформить подобные таблицы в минималистском стиле, поместив двухпиксельную границу под заголовком th .

top-table1

 Employee Salary Bonus Supervisor
 Stephen C. Cox $300 $50 Bob
 Josephin Tan $150 - Annie
 Joyce Ming $200 $35 Andy
 James A. Pentel $175 $25 Annie

Employee	Salary	Bonus	Supervisor
Stephen C. Cox	$300	$50	Bob
Josephin Tan	$150	-	Annie
Joyce Ming	$200	$35	Andy
James A. Pentel	$175	$25	Annie

table < font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif; font-size: 14px; background: white; max-width: 70%; width: 70%; border-collapse: collapse; text-align: left; >th < font-weight: normal; color: #039; border-bottom: 2px solid #6678b1; padding: 10px 8px; >td < color: #669; padding: 9px 8px; transition: .3s linear; >tr:hover td

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

top-table2

td < border-bottom: 1px solid #ccc; color: #669; padding: 9px 8px; transition: .3s linear; >/*остальной код - как в примере выше*/

Добавление эффекта :hover для элемента tr облегчит чтение таблиц, оформленных в минималистском стиле. При наведении курсора мыши на ячейку, остальные ячейки той же строки выделяются одновременно, что упрощает процесс отслеживания информации, если таблицы имеют несколько столбцов.

top-table3

th < font-weight: normal; color: #039; padding: 10px 15px; >td < color: #669; border-top: 1px solid #e8edff; padding: 10px 15px; >tr:hover td

2. Вертикальный минимализм

Несмотря на то, что подобные таблицы используются редко, тем не менее, вертикально ориентированные таблицы полезны для категоризации или сравнения описания объектов, представленных колонкой. Можно оформить их в минималистском стиле, добавив пробел, разделяющий столбцы.

top-table4

th < font-weight: normal; border-bottom: 2px solid #6678b1; border-right: 30px solid white; border-left: 30px solid white; color: #039; padding: 8px 2px; >td

3. «Коробочный» стиль

Наиболее надежным стилем для оформления таблиц всех типов, является так называемый «коробочный» стиль. Достаточно подобрать хорошую цветовую гамму, а затем задать цвет фона для всех ячеек. Не забудьте подчеркнуть различие между строками, установив границы в качестве разделителя.

top-table5

th < font-size: 13px; font-weight: normal; background: #b9c9fe; border-top: 4px solid #aabcfe; border-bottom: 1px solid white; color: #039; padding: 8px; >td < background: #e8edff; border-bottom: 1px solid white; color: #669; border-top: 1px solid transparent; padding: 8px; >tr:hover td

Самое сложное — найти ту цветовую гамму, которая будет гармонично сочетаться с вашим сайтом. Если сайт нагружен по графике и дизайну, то вам будет довольно трудно использовать этот стиль.

top-table6

table < font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif; font-size: 14px; max-width: 70%; width: 70%; text-align: center; border-collapse: collapse; border-top: 7px solid #9baff1; border-bottom: 7px solid #9baff1; >th < font-size: 13px; font-weight: normal; background: #e8edff; border-right: 1px solid #9baff1; border-left: 1px solid #9baff1; color: #039; padding: 8px; >td

4. Горизонтальная зебра

Зебра-таблица выглядит довольно привлекательной и удобной. Дополнительный цвет фона может служить в качестве визуальной подсказки для людей при чтении таблицы.

top-table7

th < font-weight: normal; color: #039; padding: 10px 15px; >td < color: #669; border-top: 1px solid #e8edff; padding: 10px 15px; >tr:nth-child(2n)

5. Газетный стиль

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

top-table8

table < border: 1px solid #69c; >th < font-weight: normal; color: #039; border-bottom: 1px dashed #69c; padding: 12px 17px; >td < color: #669; padding: 7px 17px; >tr:hover td

top-table9

table < border: 1px solid #69c; >th < font-weight: normal; color: #039; padding: 10px; >td < color: #669; border-top: 1px dashed white; padding: 10px; background:#ccddff; >tr:hover td

top-table10

table < border: 1px solid #6cf; >th < font-weight: normal; font-size: 13px; color: #039; text-transform: uppercase; border-right: 1px solid #0865c2; border-top: 1px solid #0865c2; border-left: 1px solid #0865c2; border-bottom: 1px solid white; padding: 20px; >td

6. Фон таблицы

Если вы ищете быстрый и уникальный способ оформления таблицы, выберите привлекательное изображение или фото, относящиеся к теме таблицы и установите ее фоном таблицы.

table < background: url("https://html5book.ru/wp-content/uploads/2019/04/suggestions.png") 98% 86% no-repeat; >th < font-weight: normal; font-size: 14px; color: #339; padding: 10px 12px; background: white; >td < color: #669; border-top: 1px solid white; padding: 10px 12px; background: rgba(51, 51, 153, .2); transition: .3s; >tr:hover td

2.18. CSS3-оформление текста

Модуль содержит возможности CSS, относящиеся к оформлению текста, такие как подчеркивание, тени текста, а также акценты в тексте восточно-азиатских языков.

Свойства для оформления текста

Содержание:
1. Оформление линии: подчеркивание, обводка и зачеркивание
1.1. Вид линии оформления: свойство text-decoration-line
1.2. Стиль линии оформления: свойство text-decoration-style
1.3. Цвет линии оформления: свойство text-decoration-color
1.4. Краткая запись свойств линии оформления: свойство text-decoration
1.5. Расположение линии оформления: свойство text-underline-position
2. Тень текста: свойство text-shadow
2.1. Примеры тени текста
2.2. Эффекты тени при наведении
2.3. Анимация тени

1. Оформление линии: подчеркивание, обводка и зачеркивание

Подчеркивание, обводка и перечеркивающие линии отображаются только для незамещаемых блоков уровня строки ( display: inline ) и отображаются по всему тексту, включая пробелы между символами и словами, за исключением отступов в начале и конце строки.

Браузеры могут прерывать подчеркивание и обводку в том месте, где линия пересекает глиф, отображаясь на некотором расстоянии по обе стороны от контура глифа. Когда браузер прерывает подчеркивание или обводку на границах глифа, форма линии на этой границе должна соответствовать форме глифа. Однако, спецификация не предписывает конкретный метод для «следования форме» глифа, оставляя это на усмотрение браузеру.

1.1. Вид линии оформления: свойство text-decoration-line

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

IE: —
Edge: —
Firefox: 36, 35 -moz-
Chrome: 57
Safari: 12.1, 7.1 -webkit-
Opera: 44
iOS Safari: 8 -webkit-
UC Browser for Android: 11.8
Chrome for Android: 73
Samsung Internet: 7.2

Свойство text-decoration-line определяет, какой тип линии, если таковые имеются, добавляется к элементу.

Свойство не наследуется.

text-decoration-line
Значения:
none	Ни оформляет, ни запрещает оформление текста. Значение по умолчанию.
underline	Подчёркивает каждую строку текста.
overline	Каждая строка текста имеет линию над ней (то есть на противоположной стороне от подчеркивания).
line-through	Добавляет линию через середину каждой строки текста.
inherit	Наследует значение свойства от родительского элемента.
initial	Устанавливает значение свойства в значение по умолчанию.

text-decoration-line: none; text-decoration-line: underline; text-decoration-line: overline; text-decoration-line: line-through; text-decoration-line: blink; text-decoration-line: underline overline; text-decoration-line: overline underline line-through; text-decoration-line: inherit; text-decoration-line: initial;

1.2. Стиль линии оформления: свойство text-decoration-style

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

IE: —
Edge: —
Firefox: 36, 35 -moz-
Chrome: 57
Safari: 12.1, 7.1 -webkit-
Opera: 44
iOS Safari: 8 -webkit-
UC Browser for Android: 11.8
Chrome for Android: 73
Samsung Internet: 7.2

Свойство text-decoration-style определяет стиль линий, нарисованных для оформления текста, указанного в элементе. Значения имеют то же значение, что и для свойства border-style .

Свойство не наследуется.

text-decoration-style
Значения:
solid	Добавляет отрезок простой линии. Значение по умолчанию.
double	Две параллельные сплошные линии с небольшим промежутком между ними.
dotted	Последовательность круглых точек.
dashed	Последовательность прямоугольных штрихов.
wavy	Указывает на волнистую линию.
inherit	Наследует значение свойства от родительского элемента.
initial	Устанавливает значение свойства в значение по умолчанию.

text-decoration-style: solid; text-decoration-style: double; text-decoration-style: dotted; text-decoration-style: dashed; text-decoration-style: wavy; text-decoration-style: inherit; text-decoration-style: initial;

1.3. Цвет линии оформления: свойство text-decoration-color

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

IE: —
Edge: —
Firefox: 36, 35 -moz-
Chrome: 57
Safari: 12.1, 7.1 -webkit-
Opera: 44
iOS Safari: 8 -webkit-
UC Browser for Android: 11.8
Chrome for Android: 73
Samsung Internet: 7.2

Свойство text-decoration-color определяет цвет линии оформления текста, установленный для элемента с text-decoration-line .

Свойство не наследуется.

Значения:
цвет	Значение принимает все форматы цвета свойства color. Значение по умолчанию currentColor .
inherit	Наследует значение свойства от родительского элемента.
initial	Устанавливает значение свойства в значение по умолчанию.

text-decoration-color: currentColor; text-decoration-color: salmon; text-decoration-color: #00ff00; text-decoration-color: rgba(255, 128, 128, 0.5); text-decoration-color: transparent; text-decoration-color: inherit; text-decoration-color: initial;

1.4. Краткая запись свойств линии оформления: свойство text-decoration

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

IE: —
Edge: —
Firefox: 36, 35 -moz-
Chrome: 57
Safari: 12.1, 7.1 -webkit-
Opera: 44
iOS Safari: 8 -webkit-
UC Browser for Android: 11.8
Chrome for Android: 73
Samsung Internet: 7.2

Свойство text-decoration является краткой формой записи свойств text-decoration-line text-decoration-style text-decoration-color в одном объявлении. Пропущенные значения устанавливаются на их начальные значения. Значение по умолчанию text-decoration: none solid currentColor; . Свойство не наследуется. Тем не менее, стиль всех линий оформления текста должен быть одинаковый для одного элемента.

1.5. Расположение линии оформления: свойство text-underline-position

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

IE: —
Edge: 12
Firefox: —
Chrome: 71
Safari: —
Opera: —
iOS Safari: —
UC Browser for Android: ?
Chrome for Android: 71
Samsung Internet: —

Свойство text-underline-position устанавливает положение линии подчеркивания, указанного в элементе.

Значения:
auto	Браузер может использовать любой алгоритм для определения позиции подчеркивания, тем не менее линия должна быть размещена на или под базовой линией текста. Значение по умолчанию.
under	Подчеркивание расположено под текстовым содержимым элемента. В этом случае подчеркивание обычно не пересекает нижний выносной элемент. Это значение можно комбинировать с left или right , если конкретная сторона предпочтительна в вертикальных типографских режимах.
left	В вертикальных типографских режимах подчеркивание выравнивается по левому краю текста. Тем не менее, это значение интерпретируется как under .
right	В вертикальных типографских режимах подчеркивание выравнивается по правому краю текста. Тем не менее, это значение интерпретируется как under .
inherit	Наследует значение свойства от родительского элемента.
initial	Устанавливает значение свойства в значение по умолчанию.

text-underline-position: auto; text-underline-position: under; text-underline-position: left; text-underline-position: right; text-underline-position: under left; text-underline-position: under right; text-underline-position: inherit; text-underline-position: initial;

2. Тень текста: свойство text-shadow

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

IE: 10
Edge: 12
Firefox: 3.5
Chrome: 4
Safari: 4
Opera: 10
iOS Safari: 3.2
UC Browser for Android: 11.8
Chrome for Android: 73
Samsung Internet: 4

Свойство text-shadow используется для добавления тени к тексту. Тень текста — интересный инструмент, который позволяет создавать удивительные эффекты. Тени могут быть однослойными или многослойными, размытыми, цветными или полупрозрачными. Задавая тень для элемента, можно указывать только одно значение длины и цвет, таким образом создавая цветную копию отдельного символа или слова. Также, с помощью тени можно сделать текст более читаемым, если контраст между цветом текста и фоном невелик.

Каждая тень применяется как к самому тексту, так и к элементам его оформления (свойство text-decoration ). Одновременно можно задавать несколько теней, указывая их через запятую. Тени накладываются друг на друга, но не перекрывают сам текст. Первая тень всегда расположена сверху над остальными тенями. Свойство наследуется.

Каждая тень определяется двумя или тремя значениями длины и необязательным цветом. Допустимы длины, равные 0 .

Свойство не наследуется.

text-shadow-syntax

text-shadow
Значения:
x-offset	Задает горизонтальное смещение тени. Положительное значение рисует тень, смещенную вправо от текста, отрицательная длина — влево.
y-offset	Задает вертикальное смещение тени. Положительное значение смещает тень вниз, отрицательное — вверх.
blur	Задает радиус размытия. Отрицательные значения не допускаются. Если значение размытия равно нулю, то край тени четкий. В противном случае, чем больше значение, тем больше размыт край тени.
цвет	Задает цвет тени. Если цвет отсутствует, используемый цвет берется из свойства color .
none	Значение по умолчанию, означает отсутствие тени текста. Убирает тень элемента из группы элементов с заданным свойством.
initial	Устанавливает значение свойства в значение по умолчанию.
inherit	Наследует значение свойства от родительского элемента.

В отличие от box-shadow , текстовые тени не обрезаются и могут отображаться, если текст частично прозрачен. Как и box-shadow , текстовые тени не влияют на макет и не вызывают прокрутку или увеличение размера прокручиваемой области.

text-shadow: 2px 2px 4px pink; text-shadow: #fc0 1px 0 10px; text-shadow: 5px 5px #4D4644; text-shadow: blue 2px 5px; text-shadow: 5px 10px; text-shadow: inherit; text-shadow: initial;

Css стиль который убирает табличные пробелы

border-spacing

Синтаксис

Значения

Как убрать пробелы между ячейками в HTML-таблице

4 ответа

2.8. CSS-таблицы

Форматирование таблиц

1. Границы таблицы border

2. Как задать ширину и высоту таблицы

3. Как задать фон таблицы

4. Столбцы таблицы

5. Как добавить таблице заголовок

6. Как убрать промежуток между рамками ячеек

7. Как увеличить промежуток между рамками ячеек

8. Как скрыть пустые ячейки таблицы

9. Компоновка макета таблицы с помощью свойства table-layout

10. Лучшие макеты таблиц

1. Горизонтальный минимализм

2. Вертикальный минимализм

3. «Коробочный» стиль

4. Горизонтальная зебра

5. Газетный стиль

6. Фон таблицы

2.18. CSS3-оформление текста

Свойства для оформления текста

1. Оформление линии: подчеркивание, обводка и зачеркивание

1.1. Вид линии оформления: свойство text-decoration-line

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

1.2. Стиль линии оформления: свойство text-decoration-style

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

1.3. Цвет линии оформления: свойство text-decoration-color

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

1.4. Краткая запись свойств линии оформления: свойство text-decoration

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

1.5. Расположение линии оформления: свойство text-underline-position

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

2. Тень текста: свойство text-shadow

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

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