. .

WEB DESIGN : Paragraph Dan BR Line breaks

Posted by CHRISTIANTO D,WIBOWO | D3MI-2016 STMIK BUMI GORA On Minggu, Desember 25, 2016 No comments

WEB DESIGN : Paragraph Dan BR breaks, Sebelum lanjutkan pembelajaran ini, perlu diketahui bacalah dulu artikel pembelajaran sebelumnya dan kuasai pengenalan pengetahuan dasar di :
WEB PROGRAMMING
Terimakasih pada sumber pembelajaran ini :
Jika kita pernah menggunakan pengolah kata seperti Microsoft Word maka kita tahu bahwa untuk memulai sebuah paragraf baru yang perlu dilakukan adalah untuk menekan tombol Enter pada keyboard. kursor kemudian akan bergerak ke bawah, siap untuk mulai mengetik. Dalam HTML, kita tidak dapat melakukan seperti itu. Jika kita ingin memulai sebuah paragraf baru, kita harus menggunakan tag P.
HTML <p> mendefinisikan sebuah paragraf:
Untuk mencobanya, tambahkan berikut tepat di bawah Heading, kita dapat menggunakan teks sendiri atau copy saja text ini :
<!DOCTYPE html>
<html>
<body>

<p>This is a paragraph.</p>
<p>BAKTI KEPADA ORANGTUA.</p>
<p>Di dunia ini sering dijumpai anak-anak yang tidak berbakti kepada orangtuanya. Mereka sering menyalahkan orangtuanya karena mereka menganggap bahwa orangtuanya tidak memberikan cinta kasih dan perhatian yang penuh kepada mereka. Mereka selalu menuntut cinta kasih dan perhatian dari orangtuanya karena mereka menganggap bahwa cinta kasih dan perhatian itu wajib diberikan oleh orangtua kepada mereka. Mereka tidak menyadari bahwa anak yang baik seyogyanya tidak menuntut cinta kasih dan perhatian, tetapi melakukan kewajibannya dengan
baik..</p>
<p>Di dunia ini sering dijumpai anak-anak yang selalu menuntut agar orangtuanya dapat menjadi manusia yang sempurna dalam berbagai hal, seperti Ariya Puggala (makhluk suci). Anak-anak selalu menuntut agar orangtuanya berkelakuan baik dan bertutur kata ramah, tanpa pernah mengoreksi dirinya sendiri. Anak-anak selalu melihat sifat-sifat buruk yang dimilikinya oleh orangtuanya, tanpa pernah menyadari bahwa orangtuanya yang belum mencapai kesucian itu masih dapat berbuat salah. Anak-anak selalu mencela dan membenci orangtuanya jika orangtuanya berbuat salah. Tanpa pernah berusaha memberitahu kesalahan orangtuanya dengan cara yang bijaksana. Anak-anak tidak pernah menyadari bahwa orangtuanya dapat berwatak keras itu sesungguhnya karena pengalaman masa lalunya. Anak-anak tidak pernah menyadari bahwa sesungguhnya tidak mudah untuk merubah sifat dan watak orangtuanya yang keras itu. Anak-anak tidak pernah menyadari bahwa jika mereka tidak dapat merubah sifat dan watak orangtuanya yang keras itu, maka seharusnyalah mereka merubah pikirannya sendiri..</p>
<p>Di dunia ini sering dijumpai anak-anak yang tidak memperdulikan kesejahteraan, kebahagiaan, dan kesehatan orangtuanya. Mereka tidak pernah menanyakan apakah orangtuanya tidak menderita panas atau dingin, lapar atau haus. Mereka tidak pernah menanyakan, apakah orangtuanya dapat tidur nyenyak dan beristirahat dengan tenang. Mereka tidak pernah menanyakan apakah orangtuanya tidak menderita sakit apapun. Mereka tidak pernah melayani orangtuanya dengan baik. Mereka tidak pernah memperhatikan kesusahan orangtuanya, Mereka tidak pernah mengetahui bahwa orangtuanya sering menangis, meratap, dan berkeluh kesah.</p>
<p>Di dunia ini sering dijumpai anak-anak yang melupakan kebaikan orangtuanya. Mereka tidak menyadari pengorbanan yang amat besar yang telah diberikan oleh orangtuanya kepada mereka. Mereka tidak tahu berterima kasih kepada orangtuanya. Mereka tidak berbakti kepada orangtuanya. Mereka tidak berusaha menghibur dan membahagiakan orangtuanya. Mereka tidak berusaha memenuhi keinginan-keinginan orangtuanya. Mereka baru menyadari </p>
<p>semua itu ketika orangtuanya sudah meninggal dunia. Mereka baru menyesali semua sikap dan tingkah lakunya sebagai anak yang tidak berbakti. Penyesalan memang selalu datang terlambat..</p>
<p>Dalam kitab suci Dhammapada Bab V ayat 67, Sang Buddha bersabda,.</p>
<p>“Bilamana suatu perbuatan setelah selesai dilakukan membuat seseorang menyesal, maka perbuatan itu tidak baik. Orang itu akan menerima akibat perbuatannya dengan ratap tangis dan wajah yang bergelimang air mata.”.</p>
<p>This is a paragraph.</p>

</body>
</html>
Perhatikan Tag <P>..</P>, kita harus menggunakan tag P setiap kali ingin memulai sebuah paragraf baru. Sebenarnya,kita tidak perlu tag P penutupan </P>, dan itu tidak menimbulkan kesalahan, karena setiap ada kalimat yang diawali dengan <P> otomatis akan membuat paragraph baru walaupun tidak ditutup kemudian. Coba saja dan buktikan hilangkan </P> itu tidak menyebabkan perubahan apapun. Namun dalam coding web modern, yang terbaik adalah menggunakan tag penutup untuk paragraf, sehingga kita dapat menambahkan aturan Styling.

Perhatikan jeda paragraf dalam teks. Perhatikan juga, bahwa meskipun kode kita menjorok/tidak beraturan, ini tidak masalah di browser. browser akan mengabaikan semua indentasi, dan setiap spasi ekstra. Jika kita ingin spasi putih, kita harus 'memberitahu' browser. kita melakukan ini dengan tag BR - <br>...</br>, seperti P, nanti akan kita lihat.

Sebagai latihan, cobalah menghapus tag P pembuka <P> dalam kode kita. Simpan dan refresh browser, perhatikan apa yang terjadi : TIDAK ADA PENGARUHNYA, meskipun kita menghapus semua tag P. Hal ini karena tag H pos memasukkan jeda paragraf mereka sendiri secara otomatis (default).

HTML Display
Kita tidak bisa yakin bagaimana HTML akan ditampilkan. Besar atau kecil layar, dan jendela ukurannya akan menciptakan hasil yang berbeda. Dengan HTML, kita tidak dapat mengubah output dengan menambahkan spasi ekstra atau baris ekstra dalam kode HTML kita. Browser akan menghapus spasi ekstra dan garis ekstra saat halaman ditampilkan:
<!DOCTYPE html>
<html>
<body>

<p>
This paragraph
contains a lot of lines
in the source code,
but the browser
ignores it.
</p>

<p>
This paragraph
contains      a lot of spaces
in the source     code,
but the    browser
ignores it.
</p>

<p>
The number of lines in a paragraph depends on the size of the browser window. If you resize the browser window, the number of lines in this paragraph will change.
</p>

</body>
</html>

Meskipun terlihat berantakan, tetapi tampilannya akan seperti ini :
This paragraph contains a lot of lines in the source code, but the browser ignores it.

This paragraph contains a lot of spaces in the source code, but the browser ignores it.

The number of lines in a paragraph depends on the size of the browser window. If you resize the browser window, the number of lines in this paragraph will change.


BR Line Break tag
Tag BR <br> digunakan ketika kita tidak ingin Paragraf istirahat penuh. Jarak antara baris teks kemudian dikurangi. Tag BR tidak memerlukan tag penutup, dan dapat hanya dengan sendirinya. Sebagai contoh, tambahkan <br> ke akhir setiap teks <p>........teks<br>.
<!DOCTYPE html>
<html>
<body>

<p>This is a paragraph.<br>
<p>BAKTI KEPADA ORANGTUA.<br>
<p>Di dunia ini sering dijumpai anak-anak yang tidak berbakti kepada orangtuanya. Mereka sering menyalahkan orangtuanya karena mereka menganggap bahwa orangtuanya tidak memberikan cinta kasih dan perhatian yang penuh kepada mereka. Mereka selalu menuntut cinta kasih dan perhatian dari orangtuanya karena mereka menganggap bahwa cinta kasih dan perhatian itu wajib diberikan oleh orangtua kepada mereka. Mereka tidak menyadari bahwa anak yang baik seyogyanya tidak menuntut cinta kasih dan perhatian, tetapi melakukan kewajibannya dengan
baik.<br>
<p>Di dunia ini sering dijumpai anak-anak yang selalu menuntut agar orangtuanya dapat menjadi manusia yang sempurna dalam berbagai hal, seperti Ariya Puggala (makhluk suci). Anak-anak selalu menuntut agar orangtuanya berkelakuan baik dan bertutur kata ramah, tanpa pernah mengoreksi dirinya sendiri. Anak-anak selalu melihat sifat-sifat buruk yang dimilikinya oleh orangtuanya, tanpa pernah menyadari bahwa orangtuanya yang belum mencapai kesucian itu masih dapat berbuat salah. Anak-anak selalu mencela dan membenci orangtuanya jika orangtuanya berbuat salah. Tanpa pernah berusaha memberitahu kesalahan orangtuanya dengan cara yang bijaksana. Anak-anak tidak pernah menyadari bahwa orangtuanya dapat berwatak keras itu sesungguhnya karena pengalaman masa lalunya. Anak-anak tidak pernah menyadari bahwa sesungguhnya tidak mudah untuk merubah sifat dan watak orangtuanya yang keras itu. Anak-anak tidak pernah menyadari bahwa jika mereka tidak dapat merubah sifat dan watak orangtuanya yang keras itu, maka seharusnyalah mereka merubah pikirannya sendiri..<br>
<p>Di dunia ini sering dijumpai anak-anak yang tidak memperdulikan kesejahteraan, kebahagiaan, dan kesehatan orangtuanya. Mereka tidak pernah menanyakan apakah orangtuanya tidak menderita panas atau dingin, lapar atau haus. Mereka tidak pernah menanyakan, apakah orangtuanya dapat tidur nyenyak dan beristirahat dengan tenang. Mereka tidak pernah menanyakan apakah orangtuanya tidak menderita sakit apapun. Mereka tidak pernah melayani orangtuanya dengan baik. Mereka tidak pernah memperhatikan kesusahan orangtuanya, Mereka tidak pernah mengetahui bahwa orangtuanya sering menangis, meratap, dan berkeluh kesah.<br>
<p>Di dunia ini sering dijumpai anak-anak yang melupakan kebaikan orangtuanya. Mereka tidak menyadari pengorbanan yang amat besar yang telah diberikan oleh orangtuanya kepada mereka. Mereka tidak tahu berterima kasih kepada orangtuanya. Mereka tidak berbakti kepada orangtuanya. Mereka tidak berusaha menghibur dan membahagiakan orangtuanya. Mereka tidak berusaha memenuhi keinginan-keinginan orangtuanya. Mereka baru menyadari <br>
<p>semua itu ketika orangtuanya sudah meninggal dunia. Mereka baru menyesali semua sikap dan tingkah lakunya sebagai anak yang tidak berbakti. Penyesalan memang selalu datang terlambat..<br>
<p>Dalam kitab suci Dhammapada Bab V ayat 67, Sang Buddha bersabda,.<br>
<p>“Bilamana suatu perbuatan setelah selesai dilakukan membuat seseorang menyesal, maka perbuatan itu tidak baik. Orang itu akan menerima akibat perbuatannya dengan ratap tangis dan wajah yang bergelimang air mata.”.<br>
<p>This is a paragraph.<br>

</body>
</html>
Jadi jika kita tidak ingin double line dalam jeda paragraph maka gunakan tag BR. Dan hati-hati dari P tag akhir atau teks kita akan berakhir lebih jauh/jeda antar baris dari yang kita harapkan.

HTML <pre> Element
HTML <pre> elemen mendefinisikan teks terformat. Teks di dalam <pre> elemen ditampilkan dalam font fixed-width (biasanya font jenis Courier), dan mempertahankan kedua ruang dan jeda baris:
<!DOCTYPE html>
<html>
<body>

<p>The pre tag preserves both spaces and line breaks:</p>

<pre>
   My Bonnie lies over the ocean.

   My Bonnie lies over the sea.

   My Bonnie lies over the ocean.
   
   Oh, bring back my Bonnie to me.
</pre>

</body>
</html>
Output :
The pre tag preserves both spaces and line breaks:

   My Bonnie lies over the ocean.

   My Bonnie lies over the sea.

   My Bonnie lies over the ocean.
   
   Oh, bring back my Bonnie to me.
Dalam pelajaran berikutnya, kita akan melihat pada teks tebal dan miring.  Bold and Italic

0 komentar:

Posting Komentar