Read more: http://epg-studio.blogspot.com/2011/01/kode-warna-versi-3.html#ixzz1kLhI8fW7
R U M U S - 01
<div style="border: 3px black double; padding: 10px; background-color: #D8D8D8; overflow: auto; height: 50px; width: 225px; text-align: left;"> <font color="black"> KOTAK CANTIK </font></div>
==========================
H A S I L N Y A :
KOTAK CANTIK
==========================
APLIKASINYA :
Jenis border: solid, ridge, grove, inset, outset, double, dotted, dashed
==========================
R U M U S - 02
<div style="border: 3px black double; padding: 10px; background-color: pink; overflow: auto; height: 50px; width: 225px; text-align: left;"> <font color="#B40404">TULIS RUMUSMU DLM FORMAT HTML </font></div>
==========================
HASILNYA
TULIS RUMUSMU DLM FORMAT HTML
==========================
R U M U S - 03
<font color="red"> Warna MERAH </font> <br/>
<span style="color:blue"> Warna BIRU </span> <br/>
<font size="2" face="georgia" color="red">Tinggi hurufnya adalah 2</font> <br/>
<font size="8" face="georgia" color="black"> Tingginya adalah 8</font><br/>
<span style="color:blue"> Warna BIRU </span> <br/>
<font size="2" face="georgia" color="red">Tinggi hurufnya adalah 2</font> <br/>
<font size="8" face="georgia" color="black"> Tingginya adalah 8</font><br/>
==========================
H A S I L N Y A :
Warna MERAH
Warna BIRU
Tinggi hurufnya adalah 2
Tingginya adalah 8
==========================
APLIKASINYA :
Kita bisa ganti bordernya dengan: solid, ridge, grove, inset, outset, double, dotted, dashed. Begitu pula warna background kotaknya
==========================
R U M U S - 04
<br/>
<marquee direction="up" onmouseover="this.stop()" width="50%" onmouseout="this.start()" scrollamount="2" height="80" align="left">
<a href="http://hafez.wordpress.com/2008/02/15/cara-membuat-blog-di-wordpress/
" target="_blank">>WordPress-01</a><br/>
<a href="http:....." target="_blank">> Judul/link 1 </a><br/>
<a href="http:....." target="_blank">> Judul/link 2 </a><br/>
<a href="http:....." target="_blank">> Judul/link 3</a><br/>
<a href="http:....." target="_blank">> Judul/link 4 </a>
</marquee>
==========================
H A S I L N Y A :
==========================
SCROLL NAIK DIKOTAKI
==========================
R U M U S - 05
<select onchange="window.open(this.options[this.selectedIndex].value,'_blank')" style="width:220px;color:yellow;background:green" name="menu" size="1">
<option /> - JUDUL UTAMA 1 -
<!-- change the links with your own -->
<option style="width:200px;color:white;background:black" value="http:......" target="_blank" />>Judul
<option style="width:200px;color:RGB(255,255,255);background:RGB(00,00,00)" value="http:......" target="_blank" />>Judul
<option style="width:200px;color:RGB(255,255,255);background:RGB(00,00,00)" value="http:......" target="_blank" />>Judul
<option style="width:200px;color:RGB(255,255,255);background:RGB(00,00,00)" value="http:......" target="_blank" />>Judul
</select>
<select onchange="window.open(this.options[this.selectedIndex].value,'_blank')" style="width:220px;color:white;background:red" name="menu" size="1">
<option /> - JUDUL UTAMA 2 -
<!-- change the links with your own -->
<option style="width:200px;color:black;background:pink" value="http:......" target="_blank" />>Judul
<option style="width:200px;color:RGB(255,255,255);background:RGB(00,00,00)" value="http:......" target="_blank" />>Judul
<option style="width:200px;color:RGB(255,255,255);background:RGB(00,00,00)" value="http:......" target="_blank" />>Judul
<option style="width:200px;color:RGB(255,255,255);background:RGB(00,00,00)" value="http:......" target="_blank" />>Judul
</select>
==========================
H A S I L N Y A :
==========================
R U M U S - 06
<table width="168" border="2">
<tr bgcolor="lightpink">
<td><a href="http:......" target="_blank"><center>Judul</center></a> </td>
<td><a href="http:............." target="_blank"><center>Judul</center></a> </td></tr>
<tr bgcolor="powderblue">
<td><a href="http:............." target="_blank"><center>Judul</center></a> </td>
<td><a href="http:............." target="_blank"><center>Judul</center></a> </td></tr>
<tr bgcolor="yellow">
<td><a href="http:............." target="_blank"><center>Judul</center></a> </td>
<td><a href="http:............." target="_blank"><center>Judul</center></a> </td></tr>
</table>
============================
H A S I L N Y A :
============================
R U M U S - 07
<center><div>
<div style="margin: 5px;">
<div class="normalfont" style="margin-bottom: 2px;">
<input value="Memahami Dasar-dasar Elektronika" style="margin: 0px; padding: 5px; width: 50%; font-size: 11px; background:BLACK; color:WHITE; border:4px double RED;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'TUTUP DISINI'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Memahami Dasar-dasar Elektronika'; }" type="button" /></div>
<div class="alt2">
<div style="display: none;">
<div style="border: 0px solid BLACK; color:YELLOW;background-color:#8A4B08; text-align: justify; padding:10px; ">
<div style="-moz-background-clip: -moz-initial; -moz-background-inline-policy: -moz-initial; -moz-background-origin: -moz-initial; background: GREEN url(#) no-repeat scroll 0 0 ; border: 1px solid rgb(204, 204, 204); height: 250px; margin: 10px 0px; overflow: auto; padding: 10px; text-align: left; width: auto;">
TULIS MATERIMU DISINI </div>
</div>
</div>
</div>
</div>
</div>
</center>
============================
H A S I L N Y A :
============================
R U M U S - 08
<div style="border: 10px grey inset; padding: 5px; background-color: black; overflow: auto; height: 260px; width: 350px; text-align: left;">
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="down" width="350" height="250" align="center">
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTtOMcw-g5sDZ8Iawe8hNjf3gbTLUdedEZ4IskCGhxr3ct-1d0czR4RdBsQuXT-1FqE-Gx_04NOSbUuwK42Xn898Jk46CLAr981d6urpUT1htYylZs4h4wavn-V8iPrtEFX3zHFGrts6g/s1600-h/Hardware+PLC.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 340px; height: 256px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTtOMcw-g5sDZ8Iawe8hNjf3gbTLUdedEZ4IskCGhxr3ct-1d0czR4RdBsQuXT-1FqE-Gx_04NOSbUuwK42Xn898Jk46CLAr981d6urpUT1htYylZs4h4wavn-V8iPrtEFX3zHFGrts6g/s320/Hardware+PLC.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5417323307652219234" /></a>
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFzALQTXiKGgbtGpFjTrB5Xm3SU1t9QCao_vTdZjo3ES2ko7eK0jOIYkrkM4mN6gf14xkTPQVPWEJh_jaDlVF7gcxOvBxN_k-BPHI4AZhoWZ-AY_bUz-h4Vkkd6DnZCpo7buIRARsCKfs/s1600-h/02-PLC.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 340px; height: 256px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFzALQTXiKGgbtGpFjTrB5Xm3SU1t9QCao_vTdZjo3ES2ko7eK0jOIYkrkM4mN6gf14xkTPQVPWEJh_jaDlVF7gcxOvBxN_k-BPHI4AZhoWZ-AY_bUz-h4Vkkd6DnZCpo7buIRARsCKfs/s320/02-PLC.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5417265829664316210" /></a>
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5NI9Z9COFQcBS-QXHGx6HoyPv_cF5gBzm2EZAMeRPOSs7xM1PK6R1veniGDSmcdpCirOAdgF-K-NzZx57F3GoErm4wje8IBRvuYKmc4iW3TAnsMPX1NBEexHqNs17ll68k0m5zeOizZY/s1600-h/03-PLC.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 340px; height: 256px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5NI9Z9COFQcBS-QXHGx6HoyPv_cF5gBzm2EZAMeRPOSs7xM1PK6R1veniGDSmcdpCirOAdgF-K-NzZx57F3GoErm4wje8IBRvuYKmc4iW3TAnsMPX1NBEexHqNs17ll68k0m5zeOizZY/s320/03-PLC.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5417266426058274562" /></a>
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgL-bkZ2nWC8NADreY3ywezThqmvxuLeKAOevmWvNfcIecPV3zyavpiUkNYdsjf2sZKbf9Pmm1BW_Q-ngh-fmzRR6AXa1PB4JXa0O_snO3lUPiKEwWcLQX0ucAGXR0Q_GJavphh192YZww/s1600-h/04-PLC.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 340px; height: 256px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgL-bkZ2nWC8NADreY3ywezThqmvxuLeKAOevmWvNfcIecPV3zyavpiUkNYdsjf2sZKbf9Pmm1BW_Q-ngh-fmzRR6AXa1PB4JXa0O_snO3lUPiKEwWcLQX0ucAGXR0Q_GJavphh192YZww/s320/04-PLC.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5417267313705184514" /></a>
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgegqVHDQDJ7_ycx_najT2lGKPBCQfwvqw933rx74g_YeCEC7XNBRcQqmlr1JDy5XEYXiRIhf5lzQ_z19FTnopPgc-YkfIyiwB-YcK4Je-ROVjpycL6AJ5qpYIN7R6Xpp2Ygcibs77Qn8/s1600-h/06-PLC.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 340px; height: 256px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgegqVHDQDJ7_ycx_najT2lGKPBCQfwvqw933rx74g_YeCEC7XNBRcQqmlr1JDy5XEYXiRIhf5lzQ_z19FTnopPgc-YkfIyiwB-YcK4Je-ROVjpycL6AJ5qpYIN7R6Xpp2Ygcibs77Qn8/s320/06-PLC.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5417267839114050258" /></a>
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOZD8jLgTJZ_N1vHaM5SguHx6U8iLXWvjWwTXlXI-t_zB6fitALMVee3blUUKcEMKVuUWSyE9D4uh4_5CDutXu5sg2MmiICHOcoslC98fnUHdRSgVyttprshA8xr_lOy5Z2OByExZxGio/s1600-h/05-PLC.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 340px; height: 256px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOZD8jLgTJZ_N1vHaM5SguHx6U8iLXWvjWwTXlXI-t_zB6fitALMVee3blUUKcEMKVuUWSyE9D4uh4_5CDutXu5sg2MmiICHOcoslC98fnUHdRSgVyttprshA8xr_lOy5Z2OByExZxGio/s320/05-PLC.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5417267639297125218" /></a>
</marquee>
</div>
============================
H A S I L N Y A :