Tata Cara Memakai Editor HTML

Sepertinya masih banyak sobat blogger yang kebingungan dengan cara pemakaian dari ! Kita tidak perlu susah² memahami bahasa HTML secara detail bila memang hanya mau memakainya saja. Sobat perlunya apa, kebutuhannya untuk apa dan mau sampai mana memakai HTML language ini. Koben ambil contoh kasus macam begini:
Kenal dengan Microsoft Office untuk ngeutik²? Berjalannya aktifitas mengetik di komputer tanpa adanya aplikasi/software Microsoft Office tidak mungkin bisa kita lakukan. Tahu dengan Adobe Photoshop untuk edit gambar atau lainnya? Ya sama saja sob, jadi editor HTML disini yaitu aplikasi buat kita belajar bahasa HTML :) Yang kalian perlu perhatikan hanya bahasa-bahasa dasarnya saja (kalau emang gak mau serius) Simpelnya lagi begini, editor post blogger

editor post blogger sarana kita membuat postingan!!! Itu kalau diperumpamakan sama saja dengan HTML Editor juga :)

Banyak jenis & fungsi dari Editor HTML itu sob. Beres dengan pengertian dari Editor-HTML, sekarang simak macam gaya penulisan dari Cascading Style Sheets (CSS).

External Style Sheet

<head>
<link rel="stylesheet" type="text/css" href="http://link-your-host.css" media="screen" />
</head>

screen

Internal Style Sheet

<style type="text/css">

ATTRIBUTE CODED HERE

</style>

Blogazine

Inline Styles

internal style sheet

This is a Inline Styles

<p style="font-weight:bold;color:red;text-decoration:blink">This is a Inline Styles</p>

Semoga mengerti sekarang sobatku tercinta :x Yuk kita coba bagaimana memakai Editor HTML dengan gaya penulisan Internal Style Sheet.

Pertama-tama buka ini terlebih dahulu . Sesudah itu pencet tombol yg ada disana. Kemudian coba sekarang masukin bumbu CSS & HTML berikut pada kolom textarea sebelah kiri.

<style>
#loremdiv {
display: block;
margin: 0 auto;
cursor: pointer;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
height: 200px;
width: 200px;
background: #59F;
text-shadow: 1px 1px 3px #FFF; 
-webkit-transition: -webkit-border-radius 0.5s ease-in;-moz-transition:-moz-border-radius 0.5s ease-in;
-o-transition: border-radius 0.5s ease-in;-ms-transition:border-radius 0.5s ease-in;
transition: border-radius 0.5s ease-in
} 
#loremdiv:hover {
background: #F9F;
color: #FF6;
text-shadow: 1px 1px 3px #000; 
-webkit-transform: rotate(1080deg);
-moz-transform: rotate(1080deg);
-o-transform: rotate(1080deg);
-ms-transform: rotate(1080deg);
transform: rotate(1080deg);
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease
}
</style>

<div id="loremdiv">
<div style="text-align:center;padding:45px;margin:0 auto">

http://beben-koben.blogspot.com/2011/12/creativity-using-css-keyframe.html

</div>
</div>

Perhatikan Koben membuat kombinasi antara Internal & Inline Style Sheet disana.

FINAL RESULT LIKE THIS:

http://beben-koben.blogspot.com/2011/12/creativity-using-css-keyframe.html

Itu merupakan struktur kode HTML. Masih tidak paham #-o ~X( Coba-coba saja sendiri sana, renungkan lah :)
Happy lah \m/