HTML таблица, в колонке, заголовок горизонтален, строки являются вертикальными

Question

с коротко объяснить

Я хочу создать HTML таблицу как этот

Спасибо заранее.

Answer 1

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

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

tbody tr:first-of-type td{ 
    word-wrap: break-word; 
    width:1px; 
    padding:5px 2em; 
} 

Для этого HTML:

<tr> 
    <td></td> 
    <td>C o l u m n 1</td> 
    <td>C o l u m n 2</td> 
    <td>C o l u m n 3</td> 
    <td>C o l u m n 4</td> 
    <td>C o l u m n 5</td> 
    </tr> 

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

http://codepen.io/anon/pen/YWZNzV

---

В качестве альтернативы, вы можете сделать что-то вроде этого: http://codepen.io/anon/pen/grvgwZ

Html

<tr> 
    <td></td> 
    <td><span>Column&nbsp;1</span></td> 
    <td><span>Column&nbsp;2</span></td> 
    <td><span>Column&nbsp;3</span></td> 
    <td><span>Column&nbsp;4</span></td> 
    <td><span>Column&nbsp;5</span></td> 
    </tr> 

Css

span{ 
    writing-mode: vertical-rl; 
    text-orientation: upright; 
}