Senin, 23 Mei 2016

Beberapa CSS Border yang perlu kamu ketahui

    Simplenya Border merupakan Sabuah Garis Pembatas yang membatasi objek satu dengan objek lainnya. Untuk anda Seorang Template editor, css border sangat sering digunakan untuk memberikan kesan yang enak dilihat oleh pengunjung, tentunya termasuk juga adminnya.


Beberapa CSS Border yang perlu kamu ketahui
Beberapa CSS Border yang perlu kamu ketahui


   Dan  Kali ini saya akan membagikan informasi mengenai beberapa Css Border.
Diantaranya ;

  1. None : tidak menampilkan Border (Menyembunyikan)
  2. Solid : Garis Sederhana
  3. Dashed : Garis Putus - Putus
  4. Dotted : Garis Titik - titik.
  5. Double : Garis Ganda
  6. Groove : Garis alur 3D
  7. Ridge : Garis Punggung
  8. Inset : Garis Sisipan
  9. Outset : Garis Permulaan
  10. Mix : Garis Campuran
Berikut Cara Penggunaan Css Border (Contoh) :

<style type='text/css'>
contoh-border {
border-style :solid ;
border-color:#333 ;
border-width: 5px;}
</style>

atau bisa juga digabungkan seperti berikut ini ;

<style type='text/css'>
.contoh-border {
border: 5px solid #333}
</style>

Hasilnya : 

Contoh Border

Bisa ini beberapa Cara pemasangan Css Border yang perlu kamu Ketahui ;
Css
<style>
p.dotted {border-style: dotted;}
p.dashed {border-style: dashed;}
p.solid {border-style: solid;}
p.double {border-style: double;}
p.groove {border-style: groove;}
p.ridge {border-style: ridge;}
p.inset {border-style: inset;}
p.outset {border-style: outset;}
p.none {border-style: none;}
p.hidden {border-style: hidden;}
p.mix {border-style: dotted dashed solid double;}
</style>

Html

<p class="dotted">A dotted border.</p>
<p class="dashed">A dashed border.</p>
<p class="solid">A solid border.</p>
<p class="double">A double border.</p>
<p class="groove">A groove border.</p>
<p class="ridge">A ridge border.</p>
<p class="inset">An inset border.</p>
<p class="outset">An outset border.</p>
<p class="none">No border.</p>
<p class="hidden">A hidden border.</p>
<p class="mix">A mixed border.</p>




Dan itulah yang bisa saya bagikan Kali ini.
Sumber : http://www.w3schools.com/css/css_border.asp

Lorem ipsum dolor sit amet, mea prompta intellegam in, mutat doming apeirian pro an. Solum explicari vix te. Et dicant aperiri consequat usu, utamur diceret postulant sit cu.

Silahkan berikan komentar anda sesuai dengan postingan diatas.
EmoticonEmoticon