Halaman

▼

CSS : HighLight Important Text on The Box

Terinspirasi tampilan di blognya Wicky dalam salah satu postingnya yang menampilkan teks penting yang terbungkus di dalam kotak laiknya tampilan di surat kabar, kali ini edittag coba membidiknya dari sisi CSS.

Kode berikut akan memasung tek yang kita anggap penting dimunculkan dalam sebuah kotak dengan harapan teks tersebuat akan mewakili isi postingan kita dengan penataan disebalah kanan posting.
Kode berikut akan memasung tek yang kita anggap penting dimunculkan dalam sebuah kotak dengan harapan teks tersebuat akan mewakili isi postingan kita dengan penataan disebalah kanan posting.

Berikut kodenya :

<div style="background-color:#00A2C6;color:#fff; width:200px;float: right;border-top: 2px solid #000; border-bottom: 2px solid #000; padding: 5px;margin-left:15px;">Isi teks yang kita anggap penting.</div>

Contoh dari penggunaan kode ini seperti terpampang di bagian atas posting ini.Dengan demikian isi dari posting kita akan lebih mudah dikenali oleh pengunjung.Tak sekedar judul posting yang bisa mewakili isi dari posting yang kita tulis, namun dengan cara ini kita bisa menyuguhkan pesan utama atau pesan yang ingin kita garis bawahi.


Catatan :
background-color akan mewakili warna bacground dalam kotak,
color mewakili warna teks dalam kotak,
width mewakili luas dari lebar kotak,
float mewakili letak penampilan (apakah di kanan atau kiri),

Sila dicoba.

Add to Technorati Favorites

6 komentar:

  1. Tipsduniaanak.com1:12 PM

    ass wr wb... makasih ya kang infonya, dapet ilmu baru nih....sebenernya dari kemaren2 pengen di tanyakan hal ini cuman karena terlalu banyak pertanyaan yg mesti ditanyakan ke akang jd satu-satu deh, dan takutnya akang bosen hehehe, terus ttg bikin HTML banner itu kang kalau kotak HTMLnya sih muncul tapi bannernya ga muncul kenapa ya, ukurannya bukan ya yg salah, jd bingung dicoba terus juga tetep ga bisa, pengen dong kaya nuha jd ngiri juga dibikinin hehehe bayar ngggak kang, berapa?, mau dong buat tips dunia anak

    BalasHapus
  2. pyuriko1:55 PM

    Mas Agus,... utk pengkodean warna kan sprt ini: background-color:#00A2C6;color:#fff

    Bisa gak, ditulis langsung utk warna sprt: red, blue, green???

    Utk kode2 warna sprt mas Agus itu, dapatnya drmana sih????

    BalasHapus
  3. Mas Hery3:17 PM

    utk bu meti, coba bu kodenya kirim aja ke email di agushery@gmail.com

    utk iko...boleh ko...silakan saja....ndak masalah

    BalasHapus
  4. Anonim6:13 PM

    gini kang, kan di blog akang tertulis cara untuk di cssnya, nah kalo untuk misahin antara yang penting dengan yang tidak (yg dikotakin dengan yang tidak) gimana?

    ada kode khusus ga (misalnya "span class=fullpost" dan "/span" untuk read more)

    BalasHapus
  5. Anonim4:46 AM

    wah.. makasih atas ilmunya mas agus, nanti tak coba. :)

    BalasHapus
  6. Mas Hery12:08 PM

    utk dajjal, mungkin bisa diperjelas maksudnya...

    BalasHapus

Kamu bisa dapetin ilustrasi wajah yang sesuai dengan wajah kamu di moselo.com/Bikingemeys. Jangan lupa ada promo jika pesan dari aplikasinya langsung.