Website penuh inspirasi tentang Teknologi, Komputer, Pemrograman, Games, Informasi Umum dan pengetahuan lainnya. Dibuat berdasarkan pengalaman dan ilmu yang didapat. sebagai sharing dan berbagi ilmu untuk kemajuan bangsa INDONESIA TERCINTA

Ingin pasang iklan di banner ini ? harga promo hanya 50.000/Bulan. Hubungi kami di kontak

Cara Mengaplikasikan Css di Blog. Mudah dan Lengkap

CSS and Blog

Hai sobat inspirasi, sebelumnya terimakasih telah berkunjung dan lihatlah artikel kami lainnya yang sangat menginspirasi. disini kami akan membahas Cara Mengaplikasikan Css di Blog. Mudah dan Lengkap atau Cara menggunakan Css untuk Blog.

Jika Anda belum memahami  HTML dan CSS bisa lihat dulu artikel dibawah ini :

Baca juga : Belajar bahasa pemrograman HTML, CSS mudah dan lengkap
Baca juga : Kamus bahasa pemrograman dasar tag-tag HTML

oke sampai disini saya harap anda sudah memahami HTML dan CSS. langsung saja kami akan berikan contohnya untuk mengaplikasikan CSS pada Blog anda :
Biasanya penggunaan Css pada Blog membuat frame untuk postingan. contoh gambar dibawah ini :

cara menggunakanikan css di blog

Untuk script CSS nya berikut ini

Example

.w3-example{background-color:#f1f1f1;padding:0.01em 16px} .w3-code{font-family:Consolas,"courier new";font-size:16px;line-height:1.4;width:auto;background-color:#fff;padding:8px 12px;border-left:4px solid #009688;word-wrap:break-word} .w3-btn,.w3-btn-block{border:none;display:inline-block;outline:0;padding:6px 16px;vertical-align:middle;overflow:hidden;text-decoration:none !important;color:#fff;background-color:#000;text-align:center;cursor:pointer;white-space:nowrap} .w3-btn.w3-disabled,.w3-btn-block.w3-disabled,.w3-btn-floating.w3-disabled,.w3-btn:disabled,.w3-btn-floating:disabled,.w3-btn-floating-large.w3-disabled,.w3-btn-floating-large:disabled{cursor:not-allowed;opacity:0.3} .w3-btn.w3-disabled *,.w3-btn-block.w3-disabled,.w3-btn-floating.w3-disabled *,.w3-btn:disabled *,.w3-btn-floating:disabled *{pointer-events:none} .w3-btn.w3-disabled:hover,.w3-btn-block.w3-disabled:hover,.w3-btn:disabled:hover,.w3-btn-floating.w3-disabled:hover,.w3-btn-floating:disabled:hover, .w3-btn-floating-large.w3-disabled:hover,.w3-btn-floating-large:disabled:hover{box-shadow:none} .w3-btn:hover,.w3-btn-block:hover,.w3-btn-floating:hover,.w3-btn-floating-large:hover{box-shadow:0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)} .w3-btn-block{width:100%} .w3-btn,.w3-btn-floating,.w3-btn-floating-large{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;} .w3-btn-floating,.w3-btn-floating-large{display:inline-block;text-align:center;color:#fff;background-color:#000;position:relative;overflow:hidden;z-index:1;padding:0;border-radius:50%;cursor:pointer;font-size:24px} .w3-btn-floating{width:40px;height:40px;line-height:40px} .w3-btn-floating-large{width:56px;height:56px;line-height:56px} .w3-btn-group .w3-btn{float:left} .w3-btn.w3-ripple{position:relative} .w3-margin-bottom{margin-bottom:16px !important}

Copy Script CSS diatas lalu pastekan di blog anda dengan cara :
1. login ke akun blog anda di bloger
2. Setelah masuk, klik - Tema
3. Klik - Sesuaikan
4. Klik - Lanjutan
5. Scrol kebawah sampai menemukan tambahkan CSS dan Klik
6. Pastekan Script CSS di dalamnya.

Image result for css bloger

Tahap memasukan Script CSS di dalam Blog sudah selesai sekarang tinggal di gunakan dalam postingan sobat dengan cara memanggilnya menggunakan tag HTML dengan cara buat postingan baru.  Setelah isi postingan lalu pilih HTML, Carilah hal yang sobat ingin masukan ke dalam frame dan panggil/link an CSS yang telah dibuat tadi dengan cara dibawah ini :

Example

<div class="w3-example">
<h3>Example</h3>
<div class="w3-code notranslate htmlHigh">
#isi dalam frame
</div>
</div>

Setelah selesai coba sobat simpan lalu pratinjau, dan lihatlah perbedaannya.
Sampai disini semoga sobat sudah memahami cara Mengaplikasikan Css di Blog.  Script CSS di atas bisa sobat modifikasi atau diubah sesuai keinginan sobat.  Jika anda belum bisa merubah CSS nya bisa sobat belajar dahulu di artikel sebelumnya yaitu :

Baca juga : Kamus bahasa pemrograman dasar CSS lengkap dan mudah
Baca juga : Tips belajar bahasa pemrograman dasar HTML CSS
Baca juga : Membuat halaman web sederhana dengan HTML dan CSS lengkap dan mudah
Baca juga : Kamus bahasa pemrograman dasar tag-tag HTML


Mungkin itu saja Cara Mengaplikasikan Css di Blog dengan Mudah dan Lengkap . Semoga artikel ini bermanfaat, Jika tidak keberatan mohon clik iklan di web blog ini, demi keberlangsungan web blog ini.. :) terimakasih

5 Responses to "Cara Mengaplikasikan Css di Blog. Mudah dan Lengkap"

  1. bermanfaat hu!
    *jangan lupa mampir ya AORLIN(.)com

    ReplyDelete
  2. Mantaap bosskuuu jangan lupa kunjungi www.technobooks.site

    ReplyDelete
  3. membantu banget nih gan buat amatiran kayak ane

    salam olahraga dari http://counterattackid.blogspot.com

    ReplyDelete
  4. Mantep hu infonya
    Jangan lupa kunjungi juga
    www.sehatsempurna.click

    ReplyDelete

Jangan Lupa tinggalkan komentar anda jika postingan ini bermanfaat :)

Bintang Inspirasi. Powered by Blogger.

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel