ウェブサイト用の "Postgreqlのような"テーブルを設計するには？

Question

私は開発者です。これがグラフィックデザインの最初の質問です。ウェブサイトのための

、私は道のPostgreSQLのテーブル（やMySQL、または他）をデザインしたいん：

name | height | first_man 
------------+--------+----------- 
everest | 8848 | hillary 
mont blanc | 4810 | balmat 

私はこのためcodepenを始めました。

は、私たちは三つ実行する必要があります。

1 - パイプを追加します（ '|'）：私が発見した::後にこの

2のために - ダッシュを追加します（ ' - '）：I

3（合計たとえば、「=」）私は他の文字を使用することができるようにしたいので、点線の境界線を使用したくない - 踏切

Answer 1

のEtほらに（「+」）プラスを追加！ここ

参照ソリューション：http://codepen.io/bixente57/pen/JKQjpg

コード：

<table class="brutal"> 
    <thead class="brutal data"> 
    <td>name</td> 
    <td>height</td> 
    <td class="last">first_man</rd> 
    </thead> 
    <tr class="line"> 
    <td>-----------</td> 
    <td>-----------</td> 
    <td class="last">--------------</td> 
    </tr> 
    <tr class="data"> 
    <td>mont blanc</td> 
    <td>4810</td> 
    <td class="last">Balmat</rd> 
    </tr> 
    <tr class="data"> 
    <td>everest</td> 
    <td>8848</td> 
    <td class="last">hillary</rd> 
    </tr> 
</table> 

CSS

table.brutal{ 
    font-family:courier; 
} 
table.brutal thead { 
    text-align:center; 
} 
table.brutal td{ 
    margin:0; 
    padding:0; 
} 

table.brutal .data td:not(.last)::after { 
    content:'|'; 
    float:right; 
} 
table.brutal .line td:not(.last)::after { 
    content:'+'; 
    float:right; 
    padding-top:1px; 
} 

あなたはCSS/HTMLコードにコメントすることができますか？ （私はベストプラクティスを知らないかもしれませんが、改善のためにいくつかの耐火物/スタイルがあるかもしれません）