Границы ячейки таблицы с несколькими толщинами (или границей div)?

Я знаю, как иметь набор границ со стилем double на ячейке таблицы или границе div.Границы ячейки таблицы с несколькими толщинами (или границей div)?

Но как об этом (выписка из Microsoft Word):

Он имеет толстую и тонкую границу. Можем ли мы сделать это с помощью HTML/CSS?

спасибо.

Update:

Вот некоторые примеры HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 

<head> 
<meta content="en-gb" http-equiv="Content-Language"> 
<meta content="text/html; charset=utf-8" http-equiv="Content-Type"> 
<title>Untitled 1</title> 
</head> 

<body> 

<div style="border-bottom:1px black double"> 
    SAMPLE TEXT</div> 

</body> 

</html>

Он будет генерировать двойную линию, но с обеих линий, имеющих же толщину.

В примере Microsoft Word он имеет две строки, но один из них толще. Видеть? Можем ли мы сделать это с помощью CSS/HTML?

источник

2016-03-17 Andrew Truckle

не могли бы вы указать, что именно вы хотите достичь, и подумайте о том, чтобы поделиться своим кодом. – Chris

. Я только что обновил вопрос с помощью некоторого кода и дополнительного объяснения. –

Попробуйте https://jsfiddle.net/sd35acug/ – HarrieDakpan

Если вы хотите создать что-то вроде двойных линий в изображении, вы можете создать дополнительный контейнер вокруг текста:

<div class="outer"> 
    <span class="inner"> 
    Text 
    </span> 
</div>

Вы можете стилизовать эти строки, как это:

.outer { 
    border-bottom: 1px solid #000; 
    padding-bottom: 2px; 
} 
.inner { 
    border-bottom: 4px solid #000; 
}

источник

2016-03-17 13:11:56 Aember

Благодарим за помощь! –

Границы ячейки таблицы с несколькими толщинами (или границей div)?

ответ

Смежные вопросы