Membuat Border Pada Postingan Blog

Cara membuat Bingkai pada Postingan Blog dengan CSS

Border adalah batas atau perbatasan. Mungkin border akan diperlukan pada postingan untuk mempercantik tampilan post agar terlihat rapi dan menawan. Seperti membuat bingkai sederhana untuk tiap satu tulisan berbeda-beda atau membingkai postingan keseluruhannya.

Berikut beberapa contoh batas atau bingkai dengan CSS :

• None

<p style="border: 3px none; #000000; padding: 20px;">Tidak mendefinisikan garis perbatasan</p> 

Membuat batas yang tidak terlihat atau tanpa garis perbatasan.

• Dotted

<p style="border: 3px dotted; #000000; padding: 20px; align: center;"> Perbatasan garis titik-titik.</p>

Mendefinisikan perbatasan garis titik-titik.

• Dashed

<p style="border:3px dashed; #000000; padding: 20px;"> Perbatasan garis putus-putus.</p>

Mendefinisikan perbatasan garis putus-putus.

• Solid

<p style="border:3px solid; #000000; padding: 20px;"> Perbatasan garis penuh.</p>

Mendefinisikan perbatasan garis penuh.

• Double

<p style="border: 5px double; #000000;padding: 20px;"> Mendefinisikan perbatasan garis ganda.</p>

Mendefinisikan perbatasan garis ganda.

• Groove

<p style="border: 10px groove; #000000; padding: 20px;"> Mendefinisikan perbatasan garis berlekuk 3D.</p>

Mendefinisikan perbatasan garis 3D.

• Ridge

<p style="border: 10px ridge; #000000; padding: 20px;"> Mendefinisikan perbatasan garis bergerigi 3D.</p>

Mendefinisikan perbatasan garis bergerigi 3D.