疑似要素
参考サイト Glossary and Table Layout 完成したもの。 css @charset "utf-8"dl, dt, dd{ margin: 0; padding: 0; line-height: 1.0;}dl, dt, dd{ list-style: none;}.container{ width: 800px; margin: 20px auto; position: relative;/* 縦線の位置決め用 …
<html><head> <title>line</title> <meta charset="UTF-8"> <style> .square{ height:200px; width:200px; background: coral; margin: 20px auto; position: relative; } </style> </head><body><div class="container"> <div class="square"> </div></div> </body></html> たとえばこの正方形の右側に赤い線を引いてみる。
たとえばこのような図形をCSSで作るときに、、、 .container dt{ width: 130px; height: 40px; font-size: 16px; font-weight: bold; background: #ffd800; line-height: 40px; text-align: center; position: relative; float: left; } .container dt:befor…