【html/CSS】tableの二重線を一本線にする方法マンガでわかるホームページ作成ホームへ【html/CSS】tableの二重線を一本線にする方法2021年12月10日htmlでtableを作成すると二重線になってしまいますよね。「二重線じゃ気持ち悪い!一本線にしたい!」tableの二重線を一本線にする方法を解説します。二重線の状態と原因CSSを指定せずhtmlタグのtableに「border="1"」を指定すると下記のように二重線になります。</tr></table>これは実は二重線ではありません。外枠であるtableに線が引かれます。次に各セルであるtdに線が引かれます。td同士とtable間に隙間があります。これにより二重線が引かれているように見えます。CSSやhtmlの基本をしっかり理解すると、この記事の内容もより理解できるようになりますよ。↓CSSやhtmlを楽しく学べるようにマンガを描きましたのでゼヒご覧ください↓htmlやCSSをマンガで楽しく学ぼう【180ページ単行本1冊相当量】htmlから収益化までホームページ作成の基本をひととおり、マンガでクスっと笑いながら学べます。9年間ホームページを作ってきた作者の実績に基づき作られた確かな内容です。</tr></table>tableに「cellspacing="0"」を指定すると、td同士とtable間の隙間をなくすことができます。線の太さは1px同士がくっつき2pxの線となります。1pxの線にしたい場合は下記で紹介するようにCSSを使いましょう。collapse」はtableとtdの線を共有させるCSSです。隣り合っていた線が一本の線になります。border-collapse:collapseを指定1pxの線にしたいとき以上、tableの二重線を一本線にする方法でした。「この記事の内容がよくわからなかった...」「なんかうまくいかなかった...」というかたは下記記事↓でhtmlとCSSの基本を学びましょう。わからないまま突き進むより基本を学ぶのが結局近道です。htmlやCSSをマンガで楽しく学ぼう【180ページ単行本1冊相当量】htmlから収益化までホームページ作成の基本をひととおり、マンガでクスっと笑いながら学べます。9年間ホームページを作ってきた作者の実績に基づき作られた確かな内容です。マンガでわかるホームページ。