Halaman

Sabtu, 15 Mei 2021

Cara Penulisan CSS

Saat browser membaca sebuah style sheet, maka browser akan melakukan formating terhadap dokumen HTML sesuai dengan informasi yang di berikan oleh Style sheet.

Maksudnya begini, misalnya didalam style sheet terdapat informasi bahwa sebuah elemen HTML pada halaman web harus di tampilkan dengan background-color: black; dan color:white;. Maka saat style sheet tersebut di baca oleh browser, browser akan menampilkan elemen tersebut di dalam web page dengan background warna hitam dan tulisan warna putih.

Lalu Bagaimana cara Menuliskan CSS kedalam Dokumen HTML ?

Ada tiga cara dalam penulisan CSS, yaitu dengan cara External, Internal, dan Inline.

External CSS

Baca selengkapnya »
Diposting oleh di Tidak ada komentar:
Label: ,

Jumat, 14 Mei 2021

Lebih Jauh Tentang CSS

CSS adalah kepanjangan dari Cascading Style Sheet. CSS ini merupakan sebuah mekanisme sederhana yang mengatur gaya/ style pada halaman web. Style disini bisa berupa warna, ukuran, posisi, dll.

Dengan kata lain, CSS ini adalah sebuah bahasa yang berfungsi untuk melakukan styling terhdap sebuah halama web. CSS mengontrol bagaimana sebuah elemen HTML akan ditampilkan, selain itu dengan menggunakan CSS juga akan menghemat waktu kerja karena CSS ini dapat mengontrol layout dari banyak halaman web secara bersamaan.

Penyesuaian layout halaman web pada berbagai device dan layar pun dapat di tangani dengan CSS ini. Ini lah kenapa CSS mutlak diperlukan dalam pembuatan sebuah halaman web.

Pada contoh dibawah ini, sebuah halaman web akan di atur sbb :

  • Background halaman di beri warna lightblue.
  • Elemen h1 diatur posisinya menjadi rata tengah dengan warna putih.
  • dan Elemen p ditulis dengan font verdana dengan ukuran 20px.

<!DOCTYPE html>

<html>

<head>

    <style>

        body {
                      background-color: lightblue;
        }

        h1 {
                  color: white;
                  text-align: center;
        }

        p {
                  font-family: verdana;
                  font-size: 20px;
        }

    </style>

</head>

<body>

    <h1>Hello World</h1>

    <p>This is a paragraph.</p>

</body>

<html>

Hasilnya seperti ini : 

Syntax

Struktur CSS terdiri dari 2 bagian, yaitu bagian Selector dan Blok Deklarasi.

Baca selengkapnya »
Diposting oleh di Tidak ada komentar:
Label: ,

Senin, 12 April 2021

Styling Warna Pada Elemen HTML

Elemen pada dokumen HTML juga bisa kita beri styling warna. Ini berarti kita bisa memberi warna pada kontent agar tampak lebih menarik.

Bagian elemen yang bisa di beri styling warna secara umum adalah background, teks, dan border. Dalam prosesnya, kita menggunakan attribute style dengan property dan values nya CSS.

Jika kita tuliskan, strukturnya seperti ini :

<tagname attribute="property:value;"></tagname>

Contohnya misal kita akan memberi warna latar (background) pada elemen heading 1 (tag <h1>) dengan warna DodgerBlue. Maka script nya seperti ini :

<h1 style="background-color:DodgerBlue;">This is a Heading</h1>

Hasilnya seperti ini :

This is a Heading

Dalam pendeklarasian warnanya sendiri, bisa dilakukan dengan 2 cara yaitu dengan nama nya (color names) atau dengan nilainya (color values).

Deklarasi Warna Berdasarkan Namanya.

Warna dideklarasikan dengan menggunakan Predefined color name nya, contohnya : Tomato, orange, DodgerBlue, MediumSeaGreen, Gray, Slateblue, Violet, Lightgray, dll.

Baca selengkapnya »
Diposting oleh di Tidak ada komentar:
Label: , , ,
Langganan: Postingan (Atom)