Jobsheet 2

Jurusan Teknologi Informasi Politeknik Negeri Malang
Jobsheet-2: HTML & CSS

Mata Kuliah Desain dan Pemrograman Web
Pengampu: Tim Ajar Desain dan Pemrograman Web
Agustus 2021
Ketentuan;
Simpanlah file lembar jawaban ini dengan format; Kelas_Nama Lengkap
Contoh; TI 2A_Elok Nur Hamdana
Upload tugas jobsheet ini dengan batas maksimum sesuai jadwal perkuliahan masing masing kelas
Upload file tugas jobsheet di website lms.polinema
Nama : R. Sunu Raihan Wicaksono

Nim : 1941720100
Kelas : TI-2A
Tulislah Jawaban Pada Kolom Yang tersedia di bawah ini;
LEMBAR JAWABAN JOBSHEET-2
Soal
Jawaban
No
Fungsi div adalah untuk mengelompokan sebuah text sehingga background text tersebut menjadi
berbeda dengan yang tidak diberikan div.
1|Page
Agustus 2021
Perbedaan Class dengan id adalah Class dapat diaplikasikan untuk banyak element di html dan
dapat dipanggil sekaligus, sedangkan id hanya dapat diaplikasikan pada satu element saja
3
Perbedaan dari tampilan sebelumnya background berganti warna
2|Page
Agustus 2021
Gambar “bunga2.jpg” menjadi background web

5
Penggunaan repeat adalah untuk mengulang dan memnuhi background gambar dan jika no-
repeat gambar tidak akan terulang
3|Page
Agustus 2021
Disini text semua diwarna pink dan kedua box dibuat berbeda karena Class dari kedua box
berbeda.
7
Karena margin diubah maka box akan bepindah tempat.
4|Page
Agustus 2021
Padding digunakan untuk jarak text dan border.

9
Jika semakin besar px yang diterapkan di padding maka jarak text dengan border semakin jauh.
5|Page
Agustus 2021
10
Disini dapat mengatur font dan style dari text tersebut, text pertama menggunakan style normal,
kedua memakai italic, dan ketiga oblique
11
Link dapat bewarna biru karena Link:link
Link bewarna merah jika di klik kiri atau kanan karena Link:hover
12 .link:visited{
color: yellowgreen;
}
6|Page
Agustus 2021
13
Memberi warna pada class tulisan_warna, sehingga judul menjadi biru.

14 .tulisan_warna{
color: blue;
text-align: center;
}
Karena text-align diatur ke center maka class tulisan_warna menjadi di tengah.

15 .tulisan_warna{
color: blue;
text-align: center;
text-decoration: underline;
}
Mmberi kode text_decoration: underline supaya text memiliki garis bawah
7|Page
Agustus 2021
16 .tulisan_warna{
color: blue;
text-align: center;
text-decoration: underline;
letter-spacing: 5px;
}
Memberi jarak antar huruf menggunakan letter-spacing.

17
8|Page
Agustus 2021
Position static adalah posisi deimana elemen tidak dapat di edit dengan leluasa karena itu
adaldah posisi default dari html.
Position rekative adalah kebalikan dari position static kita dapat mengubah posisi elemen.
Position fixed adalah dimana kita mengatur posisi elemen secara permanen dan ketika kita scroll
maka posisi elemen tetap berada di tempat yang kita inginkan.
Position absoulute adalah dimana satu elemen menimpa elemen lain.
Position sticky sebuah elemen jika web di scroll,
9|Page
Agustus 2021
18
10 | P a g e
Agustus 2021
Position static adalah posisi deimana elemen tidak dapat di edit dengan leluasa karena itu
adaldah posisi default dari html.
Position rekative adalah kebalikan dari position static kita dapat mengubah posisi elemen.
Position fixed adalah dimana kita mengatur posisi elemen secara permanen dan ketika kita scroll
maka posisi elemen tetap berada di tempat yang kita inginkan.
Position absoulute adalah dimana satu elemen menimpa elemen lain.
Position sticky sebuah elemen jika web di scroll,
11 | P a g e

Jobsheet 2

Diunggah oleh

Informasi Dokumen

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Jobsheet 2

Diunggah oleh

Hak Cipta:

Format Tersedia

Jurusan Teknologi Informasi Politeknik Negeri Malang

Jobsheet-2: HTML & CSS

Simpanlah file lembar jawaban ini dengan format; Kelas_Nama Lengkap

Contoh; TI 2A_Elok Nur Hamdana

Upload file tugas jobsheet di website lms.polinema

Nama : R. Sunu Raihan Wicaksono

Tulislah Jawaban Pada Kolom Yang tersedia di bawah ini;

LEMBAR JAWABAN JOBSHEET-2

Perbedaan dari tampilan sebelumnya background berganti warna

Gambar “bunga2.jpg” menjadi background web

Karena margin diubah maka box akan bepindah tempat.

Padding digunakan untuk jarak text dan border.

Link dapat bewarna biru karena Link:link

Memberi warna pada class tulisan_warna, sehingga judul menjadi biru.

Karena text-align diatur ke center maka class tulisan_warna menjadi di tengah.

Mmberi kode text_decoration: underline supaya text memiliki garis bawah

Memberi jarak antar huruf menggunakan letter-spacing.

Anda mungkin juga menyukai