Pertemuan9
Assalamualaikum Teman-teman
kembali lagi sama saya nihh
kali ini aku bakal ngasih tutorial untuk memahami anatomi dan cara kerja Cascading Style Sheet (CSS).
apa itu CSS?
nah mungkin bakal aku kasih tau dulu ya apa itu CSS.
CSS merupakan salah satu dokumen website yang bertujuan untuk mengatur gaya (style) tampilan website.
CSS jugaa mempunyai banyak manfaat salah satunya yaitu memudahkan untuk mengubah tampilan hanya dengan mengubah file CSS nya saja dan CSS juga dapat digunakan dalam hampir semua jenis web browser.
Ada beberapa properti juga pada CSS text format, yaitu :
-Color = Mengatur warna dari teks
-Direction = Menentukan arah tulisan/teks DLL.
Mari kita lanjut saja ke pengcodingan nya pada CSS
Inline CSS
Mari kita lihat codingan nya terlebih dahulu;
Bila sudah inilah hasilnya :
Inline ini digunakkan untuk memasukkan style di dalam satu baris tag.
Embedded with class dan id
Mari kita lihat codingan nya
ini codingan HTML nya :
Bila sudah inilah hasilnya :
Kalau embedded sendiri CSS nya diatas terdapat di tag <head> dan ditandai dengan tag, class, atau id yang berada di codingan di atas.
Embedded with class dan id2
Untuk codingan selanjutnya hampir sama seperti yang diatas :
Bila sudah inilah hasilnya :
External with class dan id
Kalau untuk external yaitu CSS nya terdapat di luar file HTML untuk lebih mengerti mari kita lihat codingan nya terlebih dahulu.
ini untuk codingan HTML nya :
Bila sudah inilah hasilnya bersert CSS nya :
EmbHeadingColor
Bila sudah inilah hasilnya :
CSS juga dapat menerapkan untuk mengatur warna dari teks. Pengaturan warna teks dengan CSS dapat menggunakan nilai warna sebagai berikut :
1. nilai HEX misalnya, "#ff0000"
2. nilai RGB misalnya, "rgb(255,0,0)"
3. nama dari warna tersebut misalnya "red"
4. menggunakkan Color in CSS misalnya, "Thistle, GoldenRod, Salmon"
Format penulisan untuk pemberian warna pada text menggunakan CSS adalah sebagai berikut:
selector (color:nilai warna;)
FormatCharacterSpacing
Kita lihat codingan nya terlebih dahulu
ini untuk codingan HTML nya :
Bila sudah inilah hasilnya :
TextDecodanSpacing
Mari kita lihat codingan nya terlebih dahulu
ini codingan HTML nya :
Bila sudah inilah hasilnya :
gambar di atas adalah hasil keduanya.
EmbIndentAlignUpper
Kita lihat contoh codingan nya :
gambar di bawah adalah hasil dari codingan di atas :
Biografi
yang selanjutnya aku bikin contoh biografi, untuk lebih lanjut mari kita lihat codingan nya terlebih dahulu
ini codingan HTML nya :
gambar di bawah adalah hasil dari codingan di atas :
Mungkin hanya segitu saja Ilmu saya yang di berikan , semoga bermanfaat untuk Teman-teman sekalian
sampai jumpaa di postingan selanjutnya mohon maaf bila ada kesalahan karna saya baru mengalami musibah yaitu codingan yg say kerjakan hilang dan harus di buat hari ini jadi mohon maaf kekurangan nya mohon di maklumi Terima Kasih.
Wassalamualaikum mantemannn
kembali lagi sama saya nihh
kali ini aku bakal ngasih tutorial untuk memahami anatomi dan cara kerja Cascading Style Sheet (CSS).
apa itu CSS?
nah mungkin bakal aku kasih tau dulu ya apa itu CSS.
CSS merupakan salah satu dokumen website yang bertujuan untuk mengatur gaya (style) tampilan website.
CSS jugaa mempunyai banyak manfaat salah satunya yaitu memudahkan untuk mengubah tampilan hanya dengan mengubah file CSS nya saja dan CSS juga dapat digunakan dalam hampir semua jenis web browser.
Ada beberapa properti juga pada CSS text format, yaitu :
-Color = Mengatur warna dari teks
-Direction = Menentukan arah tulisan/teks DLL.
Mari kita lanjut saja ke pengcodingan nya pada CSS
Inline CSS
Mari kita lihat codingan nya terlebih dahulu;
Bila sudah inilah hasilnya :
Inline ini digunakkan untuk memasukkan style di dalam satu baris tag.
Embedded with class dan id
Mari kita lihat codingan nya
ini codingan HTML nya :
Bila sudah inilah hasilnya :
Kalau embedded sendiri CSS nya diatas terdapat di tag <head> dan ditandai dengan tag, class, atau id yang berada di codingan di atas.
Embedded with class dan id2
Untuk codingan selanjutnya hampir sama seperti yang diatas :
Bila sudah inilah hasilnya :
External with class dan id
Kalau untuk external yaitu CSS nya terdapat di luar file HTML untuk lebih mengerti mari kita lihat codingan nya terlebih dahulu.
ini untuk codingan HTML nya :
Bila sudah inilah hasilnya bersert CSS nya :
EmbHeadingColor
Bila sudah inilah hasilnya :
CSS juga dapat menerapkan untuk mengatur warna dari teks. Pengaturan warna teks dengan CSS dapat menggunakan nilai warna sebagai berikut :
1. nilai HEX misalnya, "#ff0000"
2. nilai RGB misalnya, "rgb(255,0,0)"
3. nama dari warna tersebut misalnya "red"
4. menggunakkan Color in CSS misalnya, "Thistle, GoldenRod, Salmon"
Format penulisan untuk pemberian warna pada text menggunakan CSS adalah sebagai berikut:
selector (color:nilai warna;)
FormatCharacterSpacing
Kita lihat codingan nya terlebih dahulu
ini untuk codingan HTML nya :
Bila sudah inilah hasilnya :
TextDecodanSpacing
Mari kita lihat codingan nya terlebih dahulu
ini codingan HTML nya :
Bila sudah inilah hasilnya :
gambar di atas adalah hasil keduanya.
EmbIndentAlignUpper
Kita lihat contoh codingan nya :
gambar di bawah adalah hasil dari codingan di atas :
Biografi
yang selanjutnya aku bikin contoh biografi, untuk lebih lanjut mari kita lihat codingan nya terlebih dahulu
ini codingan HTML nya :
gambar di bawah adalah hasil dari codingan di atas :
Mungkin hanya segitu saja Ilmu saya yang di berikan , semoga bermanfaat untuk Teman-teman sekalian
sampai jumpaa di postingan selanjutnya mohon maaf bila ada kesalahan karna saya baru mengalami musibah yaitu codingan yg say kerjakan hilang dan harus di buat hari ini jadi mohon maaf kekurangan nya mohon di maklumi Terima Kasih.
Wassalamualaikum mantemannn
Komentar
Posting Komentar