Html Code mengenal Span, Div, Emphasized text, small dan Mark Tag

September 18, 2018
Html Code tutorial Span, Div, Emphasized text, small dan Mark Tag - Code html di atas sudah tidak asing lagi bagi teman teman yang sering melakukan Pemrograman web, tentunya kode dasar html web di atas harus sering kita olah agar kita tidak lupa dengan kode html tersebut.

Belajar web memang menyenangkan terutama saat kita memahami script html code source tersebut, diantara tutorial html ada yang meski kita pahami seperti.

Span code, div, small, mark dan lainnya masih banyak kode html yang meski kit harus belajar kode html tersebut, mari kita mulai pelajaran html tersebut dengan sering melatih hafalan kita tentang kode html tersebut tanpa harus kita kursus web design.

Tutorial web design span, code, div, small, mark.


-------
<!DOCTYPE html> 
<html>

<head>
<title>tutorial html span tag </title>
</head>

<body>

<span>hasil dari span tag</span> tanpa span

</body>

</html>


-------

Hasil dari kode html di atas seperti ini.

Html source kode
Html source
Seperti terlihat biasa saja ya. Kaya tanpa span html source code.... ?

Mari kita coba dengan menambahkan border dalam span tersebut agar tampak terlihat hasilnya.




-------
<!DOCTYPE html> 
<html>

<head>
<title>tutorial html span tag + border</title>
</head>

<body>

<span style="border:2px solid red">hasil dari span tag</span> tanpa span

</body>

</html>


-------

Hasil dari span html code degan penambahan border akan tampak html code seperti ini.

Html mark kode


Yups .. Ternyata itulah kode span, span kode html adalah kode yang menyelimuti sebuh text yang nanti bisa kita kombinasikan dengan Backgroud, dengan color html code, juga dengan kode kode yang lainnya.


Kode html tag Div

Div adalah sebuah kode html web design yang hampir mirip dengan table tapi tetap berbeda, karena tidak dapat di fungsikan untuk sebuah table karena tidak mampu mengikat satu dengan yang lainnya.

Mari kita contohkan pemrograman web html Div.

---
<!DOCTYPE html> 
<html>

<head>
<title>Belajar html source div tag </title>
</head>

<body>
<div>
Hasil dari div
</div>
<br>
<div style="border:2px solid red">
Div tag dengan kombinasi style border
</div>

</body>

</html>


---

Sudah terlihat dari hasil kombinasi kode html div seperti di atas, kemudian ada kode <br>, kode br itu maksudnya adalah kalau di pc itu lewat 1 baris, atau enter kalu dalam pc.


Untuk hasilnya seperti ini.

Script html code

Kalu untuk div pertama tidak terlihat ya karena belum di beri tepinya, setelah di beri tepi terlihat hasilnya.

Cukup menjadi pemahaman kita tentang border html tersebut.

Kode Html Emphasized text

Kode ini di gunakan untuk desain web tentang sebuah text langsung saja lihat contohnya seperti ini.


---
<!DOCTYPE html> 
<html>

<head>
<title>tutorial html Emphasized Text</title>
</head>

<body>

Normal Text<br>
<em> hasil Emphasized Text</em>

</body>

</html>


---

Langsung saja kita lihat hasil kode tersebut
kodenya.sil totorial html sourc kode tentang emphasized text sepeti ini ya. Ternyata memang mudah ya belaja html tersebut.


Kode Html Small Text.

Kode small di fungsikan untuk membedakan text normal dengan text small dengan tujuan Fokus seo Html, dengan fokus kode tersebut akan lebih memudahkan kita membedakan kata mana yang memang penting untuk kita fokuskan dalam optimau seo text html source.

Mari kita lihat seperti apa kodenya


---
<!DOCTYPE html> 
<html>

<head>
<title>Html source small tag</title>
</head>

<body>

Normal tulisan<br>
<small>hasil dari small Text</small>
<br> contoh small : <small>small</small> normal : Sample

</body>

</html>


---

Hasil dari htmlnya seperti di bawah ini.

Html source kode

Mungkin bila kita amati akan sedikit berbeda dari tulisan normal dan small text tersebut.

Small html source bisa anda kombinasikan dengan mark kode, agar lebih terlihat dan terfokus, untuk fokus mark html source.

Marik kita lihat kode html mark tersebut.

Html code mark.

Langsung lihat contohnya.

---
<!DOCTYPE html> 
<html>

<head>
<title>tutorial html kode mark tag</title>
</head>

<body>

Tulisan normal mark
<br> mark <mark> hasil dari mark</mark> Text

</body>

</html>


--

Hasil dari kode html tersebut bisa di lihat di bawah ini langsung.

Kode html
Mark html code menandai kode html dengan dengan fokus seo opimasi html.

Kita bisa kombinasikan kode htmlnya dengan small kode seperti ini contohnya.

---
<!DOCTYPE html> 
<html>

<head>
<title>Kombunasi html kode mark dan small tag</title>
</head>

<body>

Tulisan normal mark
<br> contoh : <mark><small>hasil dari mark + small</small></mark> Text

</body>

</html>


---

Hasil dari kodenya ini.

Html source kode
Belajar html source kode sangat mudah bukan, mari kita lihat terus menerus melatih pemahaman kita tentang kode html, tanpa harus kita repot kursus html web tentunya butuh modal dan belum tentu kita bisa mahir tanpa melatihnya.

Mending kita belajar kode html sorce sendiri memahaminya perlahan pasti kita bisa, dan kita bisa mulai belajar tutorialnya satu demi satu disini.

Demikian tutorialnya semoga bermanfaat.

Share this

Related Posts

Previous
Next Post »