gravatar

HTML - Paragraphs <p>

Paragraphs tag <Br />



Okeh kita langsung maen discript HTMLnya ajah ah!
untuk penjelasannya kita bahas sejalan dengan penulisan script dan bagaimana sebuah paragrap ditampilkan di layar monitor!.

<html>
<body>
Rindu Buat Kekasih
Pagi itu diam …….
Ketika Pucuk pucuk cemara terpaku bisu
Membawa jiwaku mengembara…
Hingga menembus batas lamunku
Di sini ……..
Masih Aku simpan setangkup rindu untukmu
Di sudut hati, dimana keresahan membias sendu
Hingga lelah hati temani sepiku..
Entah….
Masih sanggupkah tangan ini melukis langit
Dan menggambar garis garis pucat wajahmu
Diantara Rindu … yang hempaskan aku.
Atau biarkan saja angin menghapus Jejakmu
Mungkin..
Aku Akan [...]
</body>
</html>

Lihat dari struktur diatas text puisi sepertinya telah diatur pemformatannya sedemikian rupa, supaya pada saat ditampilkan melalui jendela browser akan menghasilkan output atau keluaran seperti format yang telah diatur selama penulisan kode itu berlangsung.
hasil dari kode diatas adala sebagai berikut :

hasil kode HTML diatas :
Rindu Buat Kekasih Pagi itu diam ……. Ketika Pucuk pucuk cemara terpaku bisu Membawa jiwaku mengembara… Hingga menembus batas lamunku Di sini ……..
Masih Aku simpan setangkup rindu untukmu Di sudut hati, dimana keresahan membias sendu Hingga lelah hati temani sepiku.. Entah…. Masih sanggupkah tangan ini melukis langit Dan menggambar garis garis pucat wajahmu Diantara Rindu … yang hempaskan aku. Atau biarkan saja angin menghapus Jejakmu Mungkin.. Aku Akan [...]


nah bisa Anda lihat sendiri kan!.
hasil dari kode yang telah ditulis diatas hanya menghasilkan sebuah teks yang terlihat lurus ajah, dan tanpa pemformatan supaya terlihat lebih cantik!.
maka untuk mengatasi hal demikian kita hanya perlu menambahkan tag <Br />

maka kode diatas akan berubah seperti ini :
<html>
<body>
Rindu Buat Kekasih<Br />
Pagi itu diam …….<Br />
Ketika Pucuk pucuk cemara terpaku bisu<Br />
Membawa jiwaku mengembara…<Br />
Hingga menembus batas lamunku<Br />
Di sini ……..<Br />
Masih Aku simpan setangkup rindu untukmu<Br />
Di sudut hati, dimana keresahan membias sendu<Br />
Hingga lelah hati temani sepiku..<Br />
Entah….<Br />
Masih sanggupkah tangan ini melukis langit<Br />
Dan menggambar garis garis pucat wajahmu<Br />
Diantara Rindu … yang hempaskan aku.<Br />
Atau biarkan saja angin menghapus Jejakmu<Br />
Mungkin..<Br />
Aku Akan [...]<Br />
</body>
</html>


fungsi dari tag <Br /> adalah untuk pindah baris.

hasilnya adalah:

Rindu Buat Kekasih
Pagi itu diam …….
Ketika Pucuk pucuk cemara terpaku bisu
Membawa jiwaku mengembara…
Hingga menembus batas lamunku
Di sini ……..
Masih Aku simpan setangkup rindu untukmu
Di sudut hati, dimana keresahan membias sendu
Hingga lelah hati temani sepiku..
Entah….
Masih sanggupkah tangan ini melukis langit
Dan menggambar garis garis pucat wajahmu
Diantara Rindu … yang hempaskan aku.
Atau biarkan saja angin menghapus Jejakmu
Mungkin..
Aku Akan [...]

Paragraphs tag <p><Br /> </p>



<html>
<body>

<h2>Kata-Kata Bijak Albert Einstein</h2>

<p>Meski ia mengatakan, "Aku tidak punya bakat khusus. Aku hanyalah orang yang <Br />penasaran." namun nama "Einstein" sangat identik dengan kata "Jenius".<Br /> Hampir tidak ada seorangpun yang menolak jika Einstein <Br />dikatakan sebagai prototipe manusia jenius. Berikut berbagai pemikiran dan pendapat sang maskot ilmuwan modern.<Br />
..........:::..........<Br />
Hakikatku adalah yang aku pikirkan, bukan apa yang aku rasakan<Br />
.::.<Br />
Selagi ada cinta tidak perlu ada lagi pertanyaan<Br />
.::.<Br />
Aku Berpikir terus menerus berbulan bulan dan bertahun tahun, sembilan puluh <Br />sembilan kali dan kesimpulannya salah. Untuk yang keseratus aku benar.<Br />
.::.<Br />
Kalau mereka ingin menemuiku, aku ada disini. Kalau mereka ingin bertemu dengan <Br />pakaianku, bukalah lemariku dan tunjukkan pada mereka. (Ketika istrinya<Br /> memintanya berganti untuk menemui Duta Besar Jerman)<Br />
.::.<Br />
Kebanyakan orang mengatakan bahwa kecerdasanlah yang melahirkan seorang ilmuwan<Br /> besar. Mereka salah, karakterlah yang melahirkannya.<Br />
.::.<Br />
Tanda kecerdasan sejati bukanlah pengetahuan tapi imajinasi.<Br />
.::.<Br />
Imajinasi lebih berharga daripada ilmu pengetahuanLogika akan membawa Anda dari A ke B. Imajinasi akan membawa Anda kemana-mana.<Br />
.::.<Br />
Tidak ada eksperimen yang bisa membuktikn aku benar, namun sebaliknya sebuah <Br />eksperimen saja bisa membuktikan aku salah.<Br />
.::.<Br />
Orang-orang seperti kita, yang percaya pada fisika, mengetahui bahwa perbedaan <Br />antaramasa lalu, masa kini, dan masa depan hanyalah sebuah ilusi yang<Br /> terus menerus ada.<Br />
.::.<Br />
Dunia ini adalah sebuah tempat yang berbahaya untuk didiami, bukan karena orang-<Br />orangnya jahat, tapi karena orang-orangnya tak perduli.<Br />
.::.<Br />
Mencari kebenaran lebih bernilai dibandingkan menguasainya.<Br />
.::.<Br />
Hidup itu seperti naik sepeda. Agar tetap seimbang, kau harus terus bergerak.<Br />
.::.<Br />
Sudah saatnya cita-cita kesuksesan diganti dengan cita-cita pengabdian.<Br />
.::.<Br />
Lebih mudah mengubah plutonium dari pada mengubah sifat jahat manusia.<Br />
.::.<Br />
Tidak ada yang lebih merusak martabat pemerintah dan hukum negeri dibanding <Br />meloloskan undang-undang yang tidak bisa ditegakkan.<Br />
.::.<Br />
Belajarlah dari masa lalu, hiduplah untuk masa depan. Yang terpenting adalah tidak<Br /> berhenti bertanya.<Br />
.::.<Br />
Generasi-generasi yang akan datang akan kehilangan keyakinan bahwa manusia akan<Br /> berjalan di muka bumi dengan darah dan daging.<Br />
.::.<Br />
Nilai manusia terletak pada apa yang bisa dia terima.<Br />
</p>

<p>
Kalau nilai 9 itu kesuksesan dalam kehidupan, maka nilai 9 sama dengan x ditambah y <Br />ditambah z. Bekerja adalah x, y adalah bermain, dan z adalah untuk<Br /> berdiam diri.<Br />
.::.<Br />
Orang berjiwa besar akan selalu menghadapi perlawanan hebat dari orang2<Br />
"PICIK".<Br />
<Br />
Barangsiapa yang tidak pernah melakukan kesalahan,<Br />
maka dia tidak pernah mencoba sesuatu yang baru<Br />
.::.<Br />
Hal yang paling sukar dipahami di dunia ini<Br />
adalah pajak penghasilan.<Br />
.::.<Br />
Kecerdasan tidak banyak berperan dalam proses penemuan.<Br />
Ada suatu lompatan dalam kesadaran,<Br />
sebutlah itu intuisi atau apapun namanya,<Br />
solusinya muncul begitu saja dan<Br />
kita tidak tahu bagaimana atau mengapa.<Br />
.::.<Br />
Kebahagiaan dalam melihat dan<Br />
memahami merupakan anugerah<Br />
terindah alam.<Br />
.::.<Br />
Hanya ada dua cara menjalani kehidupan kita.<Br />
Pertama adalah seolah tidak ada keajaiban.<Br />
Kedua adalah seolah segala sesuatu adalah keajaiban.<Br />
.::.<Br />
Usaha pencarian kebenaran dan keindahan<Br />
merupakan kegiatan yang memberi peluang bagi kita<Br />
untuk menjadi kanak-kanak sepanjang hayat.<Br />
.::.<Br />
Hanya seseorang yang mengabdikan dirinya untuk<Br />
suatu alasan dengan seluruh kekuatan dan jiwanya yang<Br />
bisa menjadi seorang guru sejati. Dengan<Br />
alasan ini penguasaan menuntut semuanya dari seseorang.<Br />
<Br />
If you can't explain it simply, you don't understand it well enough.<Br />
.::.<Br />
In the middle of difficulty lies opportunity.<Br />
Di tengah kesulitan ada kesempatan.<Br />
.::.<Br />
True art is characterized by an irresistible urge in the creative artist.<Br />
.::.<Br />
We cannot solve our problems with the same thinking we used when we created them.<Br />
Kita tidak bisa menyelesaian suatu masalah dengan jalan berpikir yang sama ketika <Br />kita menemukan masalah tersebut.<Br />
.::.<Br />
It has become appallingly obvious that our technology has exceeded our humanity.<Br />
.::.<Br />
The secret to creativity is knowing how to hide your sources.<Br />
Rahasia kreatifitas adalah mengetahui bagaimana menyembunyikan sumber kreatifitas <Br />tersebut.<Br />
</p>
</body>
</html>

hasilnya nih Gan!

Kata-Kata Bijak Albert Einstein



Meski ia mengatakan, "Aku tidak punya bakat khusus. Aku hanyalah orang yang
penasaran." namun nama "Einstein" sangat identik dengan kata "Jenius".
Hampir tidak ada seorangpun yang menolak jika Einstein
dikatakan sebagai prototipe manusia jenius. Berikut berbagai pemikiran dan pendapat sang maskot ilmuwan modern.

..........:::..........

Hakikatku adalah yang aku pikirkan, bukan apa yang aku rasakan

.::.

Selagi ada cinta tidak perlu ada lagi pertanyaan

.::.

Aku Berpikir terus menerus berbulan bulan dan bertahun tahun, sembilan puluh
sembilan kali dan kesimpulannya salah. Untuk yang keseratus aku benar.

.::.

Kalau mereka ingin menemuiku, aku ada disini. Kalau mereka ingin bertemu dengan
pakaianku, bukalah lemariku dan tunjukkan pada mereka. (Ketika istrinya
memintanya berganti untuk menemui Duta Besar Jerman)

.::.

Kebanyakan orang mengatakan bahwa kecerdasanlah yang melahirkan seorang ilmuwan
besar. Mereka salah, karakterlah yang melahirkannya.

.::.

Tanda kecerdasan sejati bukanlah pengetahuan tapi imajinasi.

.::.

Imajinasi lebih berharga daripada ilmu pengetahuanLogika akan membawa Anda dari A ke B. Imajinasi akan membawa Anda kemana-mana.

.::.

Tidak ada eksperimen yang bisa membuktikn aku benar, namun sebaliknya sebuah
eksperimen saja bisa membuktikan aku salah.

.::.

Orang-orang seperti kita, yang percaya pada fisika, mengetahui bahwa perbedaan
antaramasa lalu, masa kini, dan masa depan hanyalah sebuah ilusi yang
terus menerus ada.

.::.

Dunia ini adalah sebuah tempat yang berbahaya untuk didiami, bukan karena orang-
orangnya jahat, tapi karena orang-orangnya tak perduli.

.::.

Mencari kebenaran lebih bernilai dibandingkan menguasainya.

.::.

Hidup itu seperti naik sepeda. Agar tetap seimbang, kau harus terus bergerak.

.::.

Sudah saatnya cita-cita kesuksesan diganti dengan cita-cita pengabdian.

.::.

Lebih mudah mengubah plutonium dari pada mengubah sifat jahat manusia.

.::.

Tidak ada yang lebih merusak martabat pemerintah dan hukum negeri dibanding
meloloskan undang-undang yang tidak bisa ditegakkan.

.::.

Belajarlah dari masa lalu, hiduplah untuk masa depan. Yang terpenting adalah tidak
berhenti bertanya.

.::.

Generasi-generasi yang akan datang akan kehilangan keyakinan bahwa manusia akan
berjalan di muka bumi dengan darah dan daging.

.::.

Nilai manusia terletak pada apa yang bisa dia terima.




Kalau nilai 9 itu kesuksesan dalam kehidupan, maka nilai 9 sama dengan x ditambah y
ditambah z. Bekerja adalah x, y adalah bermain, dan z adalah untuk
berdiam diri.

.::.

Orang berjiwa besar akan selalu menghadapi perlawanan hebat dari orang2

"PICIK".



Barangsiapa yang tidak pernah melakukan kesalahan,

maka dia tidak pernah mencoba sesuatu yang baru

.::.

Hal yang paling sukar dipahami di dunia ini

adalah pajak penghasilan.

.::.

Kecerdasan tidak banyak berperan dalam proses penemuan.

Ada suatu lompatan dalam kesadaran,

sebutlah itu intuisi atau apapun namanya,

solusinya muncul begitu saja dan

kita tidak tahu bagaimana atau mengapa.

.::.

Kebahagiaan dalam melihat dan

memahami merupakan anugerah

terindah alam.

.::.

Hanya ada dua cara menjalani kehidupan kita.

Pertama adalah seolah tidak ada keajaiban.

Kedua adalah seolah segala sesuatu adalah keajaiban.

.::.

Usaha pencarian kebenaran dan keindahan

merupakan kegiatan yang memberi peluang bagi kita

untuk menjadi kanak-kanak sepanjang hayat.

.::.

Hanya seseorang yang mengabdikan dirinya untuk

suatu alasan dengan seluruh kekuatan dan jiwanya yang

bisa menjadi seorang guru sejati. Dengan

alasan ini penguasaan menuntut semuanya dari seseorang.



If you can't explain it simply, you don't understand it well enough.

.::.

In the middle of difficulty lies opportunity.

Di tengah kesulitan ada kesempatan.

.::.

True art is characterized by an irresistible urge in the creative artist.

.::.

We cannot solve our problems with the same thinking we used when we created them.

Kita tidak bisa menyelesaian suatu masalah dengan jalan berpikir yang sama ketika
kita menemukan masalah tersebut.

.::.

It has become appallingly obvious that our technology has exceeded our humanity.

.::.

The secret to creativity is knowing how to hide your sources.

Rahasia kreatifitas adalah mengetahui bagaimana menyembunyikan sumber kreatifitas
tersebut.



HTML - Paragraph Centering

kita coba buat suatu tulisan ada di tengah dengan 2 methode :

kode pertama:
<p align="center">Farid orangnya imut banget yah..!</p>

kode kedua
<center>Farid orangnya imut banget yah..!</center>


dua kode diatas mempunyai hasil yang sama:

Farid orangnya imut banget yah..!



HTML - Paragraph Right



kita buat lagi tulisannya berada rata kanan
kodenya begini doank Gan
<p align="right">Farid orangnya imut banget yah..!</p>


and hasilnya :

Farid orangnya imut banget yah..!



Okeh itu ajah deh kayaknya tutorial kita untuk PRAGRAPH.
nanti kita bakal bahas lebih mendalam lagi saat kita udah ngebuat kasus yang biasa sering di temuin!.
keep reading Gan.

untuk Indonesia lebih baik
terus Berkarya

oya ini gan saye nemuin artikel bahasa inggris!.
mungkin berguna.
cekidot.












Division Tag

The <div> tag was added to HTML with version 3. It can be used to control the alignment of a section (or the whole) of a document.

















Syntax

HTML Text

<div align=left> ... </div>

<div align=center> ... </div>

<div align=right> ... </div>
<div align=center>All the paragraphs. <p>Will be centered</div>
All the paragraphs.

Will be centered
















The align attribute has another option, justify, but it is not support by any browsers, yet.
Paragraph Tag

HTML provides only limited paragraph formatting commands. The most fundamental is the paragraph tag itself! Each paragraph should begin with a start paragraph tag <p> and should end with an end paragraph tag </p>. In reality, most people ignore the end paragraph tag. In many cases people skip the start paragraph tag when it's superfluous such as after another end tag.






















Syntax HTML Text
<p> ... </p> <p>this is the first paragraph,

it will continue until the end

tag</p>

<p>or until another start

paragraph tag

<p>is encountered.

this is the first paragraph, it will continue until the end tag


or until another start paragraph tag


is encountered.

<p align=left> ... </p>

<p align=center> ... </p>

<p align=right> ... </p>
<p align=center>this paragraph

is centred</p>

this paragraph is centred












Break Tag

The break tag <br> is used to force the browser to start a new line! The break tag <br> has been extended to allow image alignment to be terminated.






















Syntax

HTML

Text

<br> this text will have<br>a break in the middle! this text will have

a break in the middle!
<br clear=left|right|all> <img src="star.gif" align=left width=30 height=30>this text will wrap around the image <br clear=left> until the break. this text will wrap around the image
until the break.














See "Image Attributes" for information on image alignment.
No Break Tag

The no break tag <nobr> is a Netscape extension to HTML that ensures that the browser does not start a new line within the text with the tag. This tag should be used with care, because if too much text is included in the tags then it may make it difficult for the browser to format the text, or the result could look ragged.

















Syntax HTML Text
<nobr>

... text ...

</nobr>
Today's date is <nobr>Sunday

16th July 1995.</nobr>
Today's date is Sunday 16th July 1995.











Heading Tags

There are six tags used to mark Headings: <h1> to <h6>. The higher the number the smaller the heading should be. Remember that the character formatting (font, size etc) can be set by each user... so don't assume that the font (or the font size) is the one you see on your browser!










<h1>Major Title</h1>














The heading tags are binary tags, so make sure you remember to include the closing tag.

See also: "Character Formatting - Font Tag".

Blockquote

Blockquote produces text that is indented in from both the left and right margins. The tag is intended to be used, as the name suggests, for paragraphs quoted from some source.

















Syntax HTML

Text
<blockquote>

... text ...

</blockquote>
<blockquote>

Mary had a little lamb,

its fleece was white as snow,

and it was <b>bold</b> and quite

<i>italic!</i></blockquote>

Mary had a little lamb, its fleece was white as snow, and it was bold and quite italic!
















Note that blockquote can be used with other tags...
Preformat

The <pre> tag is used to get fixed-width characters. In addition, the browser places new lines wherever they occur in the text. Normally the browser will ignore any new lines or spaces that are in the text, it will write the text across the page until it reaches the edge of the window!

















Syntax HTML Text
<pre>

...

text

...

</pre>
<pre>  As    you can      
see the <b>Pre-Format</b>
tag can be very useful!!! </pre>

As    you can      see the
Pre-Format
tag can be very useful!!!












Code Example

The <xmp> tag is very similar to <pre> but it ignores any tags (or special characters) that are placed in the text. For example, if you include <h1> in the text, it is treated like any text...

It's important to note that the browser will also ignore any character formatting such as <b> - the tag will simply be displayed like any other text.

















Syntax HTML Text
<xmp>

...text...

</xmp>
<xmp>  All HTML tags are ignored   
until the end tag is encountered,
so if you put <h1> inside <xmp> text,
it is treated like any text!
This is very useful when giving examples of HTML!
</xmp>
All HTML tags are ignored until the end tag is encountered, so if you put <h1> inside <xmp> text, it is treated like any text! This is very useful when giving examples of HTML!











Address Tag

This tag is used to enclose information such as "address, signature and authorship" (for more details see "HTML Document Structure"), the text in the tag is normally shown as italic.
















Syntax HTML Text
<address>

...text...

</address>
<address>

written by Stephen Peter<br>

School of Architecture, UNSW

</address>

written by Stephen Peter

School of Architecture, UNSW














Note that break and paragraph tags are allowed within the tag.
Center Tag

This tag is absolete use <div align=center> or <p align=center> instead!

Center does exactly what you would guess! All the information from the start tag <center> to the end tag </center> is centred. The tag is also an implied break tag, Netscape will start a new line for the centred text. Inside tables use <td align=center>.


















Syntax HTML Text
<center>

...text...

</center>
All good fish

<center>

swim round and round

</center>

in the water!