List HTML Code

List item merupakan salah satu basic HTML element yang harus kita ketahui dalam HTML. ada dua macam List item digunakan dalam pengelompokan data baik itu yang berurutan maupun yang tidak berurutan
Unordered List

Kode yang digunakan dalam penulisannya adalah <UL></UL>, dan untuk itemnya sama yaitu kode <LI></LI>.
Contoh :
Nama-nama Hari
<UL>
<LI>Senin</LI>
<LI>Selasa</LI>
<LI>Rabu</LI>
<LI>Kamis</LI>
<LI>Jumat</LI>
<LI>Sabtu</LI>
<LI>Minggu</LI>
</UL>

Maka Hasilnya seperti ini :

• Senin
• Selasa
• Rabu
• Kamis
• Jumat
• Sabtu
• Minggu

Jika menginginkan bentuk atau model yang lain dari bentuk default, Anda bisa menggunakan Square, disk, atau circle seperti ini kodenya :
Nama-nama Hari
<UL type="square">
<LI>Senin</LI>
<LI>Selasa</LI>
<LI>Rabu</LI>
<UL>
Maka hasilnya seperti ini :

• Senin
• Selasa
• Rabu

Ordered List
Kode ini untuk mengelompokan data secara berurutan,kode ini menggunakan <ol;></ol> kodenya sebagai berikut :
<b>Jadwal Harian Ku</b>
<ol start="1" type="I">
<li>Senin</li>
<ol type="a">
<li>Belajar</li>
<li>Bermain</li>
</ol>
<li>Selasa</li>
<ol type="A">
<li>Ke Kampus</li>
<li>Ke Bengkel</li>
</ol>
<li>Rabu</li>
<ol type="I">
<li>Ke Pasar</li>
<li>Istirahat</li>
</ol>
Maka hasilnya akan seperti ini

Jadwal Harian Ku

1. Senin
1. Belajar
2. Bermain
2. Selasa
1. Ke Kampus
2. ke Bengkel
3. Rabu
1. Ke Pasar
2. Istirahat

Untuk kombinasi yang lainnya bisa dicoba-coba sendiri...terima kasih

Klik disini untuk melanjutkan »»

TABLE Element in HTML

HTML Tables are contained within a TABLE element. The TABLE element denotes the range of the table, and uses attribute to define properties of it. For example, the BORDER attribute indicates the size of the border to draw around the table and between each of the table's cells -- in the notation of tables, each box within the table is called a cell. There are several other attributes besides BORDER. These are discussed in a later document.

The only two elements allowed inside a table are CAPTION, and TR. CAPTION defines a table caption, and can take one attribute -- ALIGN -- to define where the caption should be placed. Possible values are "top", "bottom" "left" and "right".

TR defines a Table Row -- a table is made up of any number of any number of rows, depending on how you design it. Each row in turn contains cells, denoted either by TD (table data) or TH (table header) elements. The number of TD or TH elements in a given row defines the number of columns in the table, while the number of TR elements defines the number of rows. In general, TD elements are used for data, while TH elements are used for row or column headings. Note that you need to be careful that each row contains the same number of cells -- otherwise the table columns will not line up correctly.

Here is a simple table example, -- a table with 3 rows and 4 columns

<TABLE BORDER="1">
<caption align="bottom">This is the Table Caption</caption>
<TR> <TH>Heading 1 <TH> Heading 2 <TH> Heading 3 <TH> Heading 4 </TH> </TR>
<TR> <TD> 0.32 </TD> <TD> 1.2 </TD> <TD> 3.2 </TD> <TD>alpha </TD> </TR>
<TR> <TD> 0.44 </TD> <TD> 0.3 </TD> <TD> 7.2 </TD> <TD> beta </TD> </TR>
</TABLE>

This table is displayed as:

This is the Table Caption

Heading 1	Heading 2	Heading 3	Heading 4
0.32	1.2	3.2	alpha
0.44	0.3	7.2	beta

Klik disini untuk melanjutkan »»

Elements in HTML Documents

The HTML instructions, along with the text to which the instructions apply, are called HTML elements. The HTML instructions are themselves called tags, and look like <element_name> -- that is, they are simply the element name surrounded by left and right angle brackets.

Most elements mark blocks of the document for particular purpose or formatting: the above tag marks the beginning of such as section. The end of this section is then marked by the ending tag </element_name>-- note the leading slash character "/" that appears in front of the element name in an end tag. End, or stop tags are always indicated by this leading slash character.

For example, the heading at the top of this page is an H2 element, (a level 2 heading) which is written as:

<H2> 2.1 Elements in HTML </H2>.

Empty Elements

Some elements are empty -- that is, they do not affect a block of the document in some way. These elements do not require an ending tag. An example is the <HR> element, which draws a horizontal line across the page. This element would simply be entered as

<HR>

Upper and Lower Case

Element names are case insensitive. Thus, the the horizontal rule element can be written as any of <hr>, <Hr> or <HR>.
Elements can have Attributes

Many elements can have arguments that pass parameters to the interpreter handling this element. These arguments are called attributes of the element. For example, consider the element A, which marks a region of text as the beginning (or end) of a hypertext link. This element can have several attributes. One of them, HREF, specifies the hypertext document to which the marked piece of text is linked. To specify this in the tag for A you write:

<A HREF="http://downloadandtutorial.blogspot.com"> marked text </a>.

where the attribute HREF is assigned the indicated value. Note that the A element is not empty, and that it is closed by the tag </a>. Note also that end tags never take attributes -- the attributes to an element are always placed in the start tag.

Klik disini untuk melanjutkan »»

create a text running on the blog

You certainly never see the text that you can move from right to left, top-down, back and forth and the other. Is not difficult to make, you certainly can memcoba applied to this Blog you like me here. Ok now we are starting to do so.
Marque from right to left
This is the HTML code
<MARQUEE Align="center" direction="right" height="200" scrollamount="2" width="40%">
WELCOME TO MY BLOG
</MARQUEE>
So a result like this:

WELCOME TO MY BLOG


To make a move from left to right to live with change direction = "left"
While the text to make the move from the bottom upwards as well as a working link is as follows:
<marquee align="center" direction="up" height="200" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="4" width="100%">
<a href="http://pp-stationery.blogspot.com/" target="new"> Stationery </ a>
<a href="http://www.kompas.com/" target="new"> KOMPAS </a>
<a href="http://www.gramediabooks.com/" target="new"> Gramedia </a>
</marquee>


Stationery
KOMPAS
Gramedia

Klik disini untuk melanjutkan »»