إنضم لنا

cara membuat background garis gird





cara membuat background garis gird atau Background Grid Lines

Pada kesempatan malam ini saya akan membuat artikel yang membahas sebuah background atau latar belakang, kalo kita membahas masalah background spertinya tidak akan pernah ada habisnya sebab , background adalah suatu tema yang bisa kita rubah sesuai kemauan dan selera kita masing masing,

Dan background sendiri bisa kita rubah menggunakan image atau gambar ataupun kode warna seperti di bawah

1.
body {
Background: #ddd;
}
Hasilnya:



2.
body {
background-image: url(http://ppcdn.500px.org/75319705/1991f76c0c6a91ae1d23eb94ac5c7a9f7e79c480/2048.jpg) ;
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
background-color: #999;
}
Hasilnya:



3.
body {
background-image:
linear-gradient(135deg, #E61545 0%, #8B1BFA 50%, #2c3e50 75%);
}
Hasilnya:



Itu hanya sebagai contoh saja, dan masih banyak lagi penulisan css untuk menghasilkan warna latar belakang,yang unik

Namun di sini saya akan membahas background sesuai judul sajah Yaitu cara membuat background garis gird biar nanti tidak keluar topik, Ok sebagai contohnya seperti ini



CONTOH: background lines Gird

Ini bukan GAMBAR INI Background




Cara ini hanya mengombinasikan 2 warna sajah namun dengan tehnik yang unik sehingga menghasilkan perpaduan warna yang unik juga

Ini css Nya:
body {
  margin: 0;
  padding: 0;
  height: 100%;
    background-color: #434343;
    background-image:linear-gradient(#434343, #282828);
}
.webcensar{
    background-color: transparent;
    background-image:       linear-gradient(0deg, transparent 24%, rgba(255, 255, 255, .05) 25%, rgba(255, 255, 255, .05) 26%, transparent 27%, transparent 74%, rgba(255, 255, 255, .05) 75%, rgba(255, 255, 255, .05) 76%, transparent 77%, transparent), linear-gradient(90deg, transparent 24%, rgba(255, 255, 255, .05) 25%, rgba(255, 255, 255, .05) 26%, transparent 27%, transparent 74%, rgba(255, 255, 255, .05) 75%, rgba(255, 255, 255, .05) 76%, transparent 77%, transparent);
  height:100%;
  background-size:20px 20px;
}
}
Ini untuk tag nya
<div class="webcensar"></div>

Itulah cara nya sangat simpel bukan semoga bermanfaat
Penulis:

Seorang Penulis Asal Tegal jawa tengah 


PENTING !!!
Untuk pertanyaan di luar topik silahkan Gunakan Komentar Facebook atau Google+ sengaja Kami sediakan Untuk komentar random Dan untuk pertanyaan seputar article gunakan komentar disqus Terimakasih...

Disqus

Disqus comments:


Google+

Google+ comments:

Facebook

Facebook comments:

This site uses cookies from Google to deliver its services, to personalise ads and to analyse traffic. Information about your use of this site is shared with Google. By using this site, you agree to its use of cookies. Detail