Codingan Kelas XI

Coding membuat paragraf
<!DOCTYPE html>
<html>
<head>
<title>Membuat paragraf</title>
</head>
<body>
<div>
<p>
CERITA SINGKAT - BALADA SI UDIN PENGEMBALA KAMBING
Teriknya siang yang begitu menyengat telah membuat gerah Si UDIN anak gembala
yang sedang menggembalakan
kambing-kambing punya Juragan TABRAN. Pohon-pohon turi di pinggiran lapangan

sepak bola itu tidak bisa mengobati
rasa panas yang menyengat badannya. Kegelisahan mendera Si UDIN dan keringat yang
mengucur deras telah membasahi sudut-sudut
kaosnya yang tampak usang.
</p>
</div>
<div>
<p>
BALADA ANAK JALANAN
Aku tergeletak di sebuah kardus kumal berwarna cokelat. Berselimutkan kain

berwarna merah. Dengan rona wajah masih memerah,
layaknya bayi yang baru lahir, aku dibiarkan begitu saja di kardus itu. Hujan
lebat diiringi gemuruh di malam itu. Itulah yang selalu
dikatakan orang-orang yang sedia merawatku sejak dahulu. Sepertinya

kelahiranku disambut wajah muram, air mata berlinang dan keringat
gelisah orang-orang saat itu.
</p>
</div>
</body>
</html>
Hasil :
Coding membuat font color dan font size
<!DOCTYPE html>
<html>
<head>
<title>Latihan 4 Membuat paragraf</title>
</head>
<body>
<div>
<p> <font color="green"><font size="10">CERITA SINGKAT - BALADA SI UDIN

PENGEMBALA KAMBING</font></font>
<br>Teriknya siang yang begitu menyengat telah membuat gerah Si UDIN anak gembala
yang sedang menggembalakan kambing-kambing
punya Juragan TABRAN.

Pohon-pohon turi di pinggiran lapangan sepak bola itu tidak bisa mengobati rasa
panas yang menyengat badannya.
Kegelisahan mendera Si UDIN dan
keringat yang mengucur deras telah membasahi sudut-sudut kaosnya yang tampak
usang.</br>
</p>
</div>
<div>
<p> <font color="blue"><font size="10">BALADA ANAK JALANAN</font></font>
<br>Aku tergeletak di sebuah kardus kumal berwarna cokelat. Berselimutkan kain

berwarna merah.
Dengan rona wajah masih memerah, layaknya bayi yang baru lahir, aku dibiarkan
begitu saja di kardus itu.
Hujan lebat diiringi gemuruh di malam itu. Itulah yang selalu dikatakan orang-
orang yang sedia merawatku sejak dahulu.
Sepertinya kelahiranku disambut wajah muram, air mata berlinang dan keringat
gelisah orang-orang saat itu.</br
</p>
</div>
</body>
</html>
Hasil :
Coding untuk mengatur paragraf
<!DOCTYPE html>
<html>
<head>
<title>Latihan 5 Mengatur paragraf</title>
<style>
p{
text-indent: 50 px;
padding: 20 px;
margin: 40 px;
border-style: dashed;
border-top-color: green;
border-bottom-color: blue;
border-left: brown;
border-right: aqua;
border-width: 5 px;
text-align: justify-all;
line-height: 200 %;
}
</style>
</head>
<body>
<p>
Mengatur paragraf dengan text indent, padding, margin, border style dan
text align
</p>
</body>
</html>
Hasil :
Coding untuk membuat garis horizontal
<!DOCTYPE html>
<html>
<head>
<title>Latihan 6 Membuat garis horizontal pada website</title>
</head>
<body>
<h1 style="text-align: center;">MEMBUAT GARIS HORIZONTAL</h1>
<hr size="15 px">
<hr width="100%">
<hr align="justify">
</body>
</html>
Hasil :
Coding membuat teks cetak tebal, miring dan garis bawah
<!DOCTYPE html>
<html>
<head>
<title>Latihan 6 membuat bold, italic dan underline</title>

</head>
<body>
<h1>
Membuat teks bold
</h1>
<p>
<strong>Tag yang digunakan</strong> bisa menggunakan strong atau <b>bisa

dengan menggunakan tag b</b> tergantung selera masing-masing
</p>
<h1>
Membuat teks underline
</h1>
<p>
<ins> Untuk membuat teks bergaris bawah</ins> Tag yang digunakan adalah
ins tapi bisa juga dengan menggunakan <u>tag u juga bisa membuat teks menjadi
tebal</u> tergantung selera masing-masing
</p>
<h1>
Membuat teks italic
</h1>
<p>
<em> Untuk membuat teks bergaris bawah</em> Tag yang digunakan adalah
ins tapi bisa juga dengan menggunakan <i>tag u juga bisa membuat teks menjadi
tebal</i> tergantung selera masing-masing
</p>
</body>
</html>
Hasil :
Coding membuat marker, pangkat dan menggabungkan format
<!DOCTYPE html>
<html>
<head>
<title>Latihan 8 membuat pangkat, marker dan menggabungkan format</title>
</head>
<body>
<h1>
Membuat pangkat
</h1>
<p>
luas persegi yang ada pada gambar adalah 100 m<sup>2</sup>
</br>
dimana pasokan O<sub>2</sub> menipis karena terserap H<sub>2</sub>O
</p>
<h1>
Membuat marker teks
</h1>
<p>
<mark> Untuk membuat teks bergaris bawah</mark> Tag yang digunakan adala
h ins tapi bisa juga dengan menggunakan <mark>tag u juga bisa membuat teks menjad
i tebal</mark> tergantung selera masing-masing
</p>
<h1>
Membuat warna marker sesuai keinginan
</h1>
<p>
<mark style="background-color: purple;"> Untuk membuat teks bergaris baw
ah</mark> Tag yang digunakan adalah ins tapi bisa juga dengan menggunakan <mark s
tyle="background-color: greenyellow;">tag u juga bisa membuat teks menjadi tebal<
/mark> tergantung selera masing-masing
</p>

<h1>
Membuat format teks
</h1>
<p>
<b><u> Untuk membuat teks bergaris bawah</b></u> Tag yang digunakan adal
ah ins tapi bisa juga dengan menggunakan <i><mark>tag u juga bisa membuat teks me
njadi tebal</i></mark> tergantung selera masing-masing
</p>
</body>
</html>
Hasil :
Coding membuat heading
<!DOCTYPE html>
<html>
<head>
<title>Latihan 3 Membuat heading</title>
</head>
<body>
<h1>Membuat heading</h1>
</body>
</html>
Hasil :
Hasil :
Coding membuat list dalam bentuk bullet dan number
<!DOCTYPE html>
<html>
<head>
<title>Latihan 2 Membuat list</title>
</head>
<body>
<div>
<ul>
<li>Apel</li>
<li>Nanas</li>
<li>Pisang</li>
<li>Rambutan</li>
<li>Mangga</li>
<li>Jambu</li>
</ul>
</div>
<div>
<ol>
<li>Apel</li>
<li>Nanas</li>
<li>Pisang</li>
<li>Rambutan</li>
<li>Mangga</li>
<li>Jambu</li>
</ol>
</div>
<div>
<ul style="list-style-type; square;">
<li>Apel</li>
<li>Nanas</li>
<li>Rambutan</li>
<li>Mangga</li>
<li>Jambu</li>
</ul>
</div>
<div>
<ol type="i">
<li>Apel</li>
<li>Nanas</li>
<li>Pisang</li>
<li>Rambutan</li>
<li>Mangga</li>
<li>Jambu</li>
</ol>
</div>
</body>
</html>
Hasil :

Codingan Kelas XI

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

Codingan Kelas XI

Diunggah oleh

Hak Cipta:

Format Tersedia

Coding membuat paragraf

CERITA SINGKAT - BALADA SI UDIN PENGEMBALA KAMBING

kambing-kambing punya Juragan TABRAN. Pohon-pohon turi di pinggiran lapangan

kaosnya yang tampak usang.

BALADA ANAK JALANAN

Aku tergeletak di sebuah kardus kumal berwarna cokelat. Berselimutkan kain

dikatakan orang-orang yang sedia merawatku sejak dahulu. Sepertinya

gelisah orang-orang saat itu.

Coding membuat font color dan font size

<title>Latihan 4 Membuat paragraf</title>

<p> <font color="green"><font size="10">CERITA SINGKAT - BALADA SI UDIN

punya Juragan TABRAN.

Kegelisahan mendera Si UDIN dan

<p> <font color="blue"><font size="10">BALADA ANAK JALANAN</font></font>

<br>Aku tergeletak di sebuah kardus kumal berwarna cokelat. Berselimutkan kain

<title>Latihan 5 Mengatur paragraf</title>

Coding untuk membuat garis horizontal

<title>Latihan 6 Membuat garis horizontal pada website</title>

<h1 style="text-align: center;">MEMBUAT GARIS HORIZONTAL</h1>

<hr size="15 px">

Coding membuat teks cetak tebal, miring dan garis bawah

<title>Latihan 6 membuat bold, italic dan underline</title>

Membuat teks bold

<strong>Tag yang digunakan</strong> bisa menggunakan strong atau <b>bisa

Membuat teks underline

Membuat teks italic

Anda mungkin juga menyukai