TUGAS PENDAHULUAN MODUL 3 : PEMROGRAMAN WEB

Tugas pendahuluan

1. Jelaskan apa yang dimaksud dengan CSS!

Jawaban

Kumpulan kode yang digunakan untuk mendefinisikan desain dari Bahasa markup, dimana Bahasa markup itu misalnya HTML.

Contoh sederhananya:

HTML sebagai kerangka manusia sedangkan CSS sebagai pelengkap untuk mempercantik tanpilan mulai dari penggunaan baju dan lainnya.

2. Jelaskan 3 cara pemanggilan CSS serta tuliskan bentuk penggunaannya!

Jawaban:

1) Internal Style

<!DOCTYPE html>

<html>

<head>

<title>Contoh Internal Style</title>

<style>

body {

background: rgb(153, 97, 97);

color: rgb(196, 189, 189);

}

h2 {

color: rgb(78, 78, 72);

border-bottom: 1px solid rgb(94, 49, 49);

}

</style>

</head>

<body>

<h2>Demo Internal Style</h2>

<p>Halaman Ini Adalah Halaman Yang Sudah Di Atur Stylenya Oleh Kode CSS </p>

</body>

</html>

Output:

2) External Style

Externalstyle.html

Style.css

<!DOCTYPE html>

<html>

<head>

<title>External style</title>

</head>

<body>

<h2>Demo External Style</h2>

<p> Halaman Ini Adalah Halaman Yang Sudah Di Atur Stylenya Oleh

Kode CSS</p>

</body>

</html>

body {

background-color: rgb(192, 132, 142);

color: black;

}

h2 {

color: rgb(108, 40, 63);

border-bottom: 1px solid black;

}

Output:

3) Inline style

<!DOCTYPE html>

<html>

<head>

<title>Document</title>

</head>

<h2 style="color: black;"> Demo Inline Style </h2>

<p style="color:red; text-decoration:underline;">Contoh Paragraf

Menggunakan Inline Style</p>

</body>

</html>

Output:

3. Jelaskan apa yang dimaksud dengan selector, declaration, property dan value pada CSS!

Jaawaban:

Selector terbagi atas 3 yaitu:

1) 1) Selector adalah serangkaian aturan dari CSS yang memilih suatu elemen yang ingin kamu beri gaya.

2) Declaration atau Deklarasi properti dan value yang akan ditentukan oleh tag bersangkutan.

3) Property merupakan jenis style atau gaya yang akan dikenakan pada Selector.

4) Value merupakan nilai dari property yang membentuk style.

4. Jelaskan perbedaan selector tag, class dan id pada CSS serta berikan contoh penggunaannya!

Jawaban:

1) 1) Selector Tag berisi tag-tag HTML yang akan dimanipulasi oleh CSS, dimana penggunaan- penggunaan tag yang dikenai CSS akan ikut berubah sesuai dengan deklarasi CSSnya.

Contoh penggunaanya:

selectortag.html

Selectortag..css

<!DOCTYPE html>

<html>

<head>

<title>Selector Tag</title>

</head>

<body>

<p>Ini adalah tag p</p>

<h1>Ini adalah tag h1</h1>

<h3>Ini adalah tag h3</h3>

</body>

</html>

h1 {

color: peachpuff;

}

Output:

Selector Id berisi identifier unik yang akan dimanipulasi oleh CSS, umumnya id atau identifier hanya dapat digunakan oleh satu elemen saja. Selector id ditandai dengan symbol pagar (#) yang diikuti dengan nama id atau identifier.

Contoh penggunaannya:

selectorid.html

Selectorid.css

<!DOCTYPE html>

<html>

<head>

<title>Selector id</title>

</head>

<body>

Ini adalah judul artikel

</div>

</body>

</html>

#header {

background-color: #8d5959;

color: #ffffff;

font-family: Arial;

font-size: 12;

font-weight: bold;

padding: 10px;

border-radius: 5px;

}

Output:

Selector Class

berisi identifier kelas yang akan dimanipulasi oleh CSS berdasarkan kelasnya yang memiliki karakteristik yang sama dan digunakan berulang-ulang.Penggunaan selector class pada struktur CSS ditandai dengan simbol titik (.) yang diikuti dengan nama kelas.

Contoh penggunaannya:

selectorclass.html

Selectorclass.css

<!DOCTYPE html>

<html>

<head>

<title>Selector class</title>

</head>

<body>

<div class="rahma">Halo Everyone</div>

</body>

</html>

.rahma {

background-color: #8d5959;

color: #ffffff;

font-family: Arial;

font-size: 12;

font-weight: bold;

padding: 10px;

border-radius: 5px;

}

Output:

Cari Blog Ini

Maulaya

TUGAS PENDAHULUAN MODUL 3 : PEMROGRAMAN WEB

Komentar

Posting Komentar