20 Mar 2015

Tag "marquee"

 Tag <marquee>

tag <marquee> biasa nya digunakan untuk mendeskripsikan teks yang bergerak. dn juga gambar akan tetapi jika kita ingin memasukan gambar kita juga harus memasukan lokasi gambar nya. untuk lebih memahami kita bisa lihat sedikit contoh di bawah, cekidot!!! 
Berikut adalah beberapa kegunaan tag <marquee> beserta dengan atribut nya: 

  • Standar tag marquee tanpa atribut
<marquee>Standar tag marquee tanpa atribut</marquee>

Standar tag marquee tanpa atribut
  •  Marquee dengan atribut direction
<marquee direction="up">marquee direction="up"</marquee>
<marquee direction="right">marquee direction="right"</marquee>
<marquee direction="down">marquee direction="down"</marquee>
<marquee direction="left">marquee direction="left"</marquee>

marquee direction="up"
marquee direction="right"
marquee direction="down"
marquee direction="left"
  • Marquee dengan atribut behavior
<marquee behavior="alternate">marquee behavior="alternate"</marquee>
<marquee behavior="scroll">marquee behavior="scroll"</marquee>
<marquee behavior="slide">marquee behavior="slide"</marquee>
marquee behavior="alternate"
marquee behavior="scroll"
marquee behavior="slide"
  • Marquee dengan gambar
jika gambar tag marquee harus di sertakan dengan alamat dari gambar tsb. <img src=.....> "sertakan alamat gambar dsini"
<marquee><img src="../images/marquee1.jpg" /> <img src="../images/marquee2.jpg" /> <img src="../images/marquee3.jpg" /></marquee>

19 Mar 2015

HTML Image & Link



HTML Image & Link



Jika sebelum nya kita telah mengaetahui sedikit tentang  HTML, maka disini saya akan melanjutkan sedikit pembahasan tentang HTML yaitu bagaimana memasukan image (gambar). Dan HTML Link.

  •         Image

Untuk memasukan gambar kita mamerlukan tag <img> yaitu tg untuk mendeskripsikan gambar, contoh:
<img src=gambar.jpg>
Dan kita bisa memasukan tipe file lainnya: gif, maupun png.
<img> : adalah tag untuk deskrpisi gambar, sedangkan
“src”    : adalah atribut untuk mencari alamat dari gambar.
Contoh:



Kemudian, kita juga mengatur besar sebuah gambar nya dengan format deskripsi:

“width” dan “height” contoh:
<img src=“pic_mountain.jpg” width=300 height=250>



  •         HTML Link

HTML link adalah hyperlink, yaitu jikan kita mengklik sebuah gambar atau text kita akan melompat ke halaman lain.
HTML Link menggunakan tag <a href> untuk mendeskripsikan nya.
Contoh:

<a href=”http://www.amikom.ac.id”>visit amikom</a>

-href : adalah atribut untuk menuju halaman web.
“visit amikom” adalah text judul yang muncul dan jika kita mengklik text tersebut kita akan masuk ke dalam alamt tujuan.
Nah, jika kita sudah mengetahui tag dari HTML Link, apabila kita ingin mendeskripsikan nya di dalam sebuah gambar maka kita tinggal kombin dengan tag dari “image”.

  •         Link Gambar

Tag nya adalah <a href> terlebih dahulu kemudian masukan tag <img>
Contoh:

<a href=”http://www.amikom.ac.id”><img src=amikom.jpg weight=”200” height=”250”></a>


  •       Target atribut

Target atribut menentukan di mana untuk membuka dokumen terkait.

Contoh ini akan membuka dokumen terkait dalam jendela browser baru atau tab baru:         

 <a href="http://www.w3schools.com/" target="_blank">Visit W3Schools!</a>

Format tag sama seperti “hyperlink” akan tetapi di <target=”_blank”> kita akan membuka jendela baru secara otomatis.

Moga yang dikit ini bermanfaat kawan, jangan pernah sungkan buat saling bagi info ya. Thx…

12 Mar 2015

Perancangan Web



”HTML” 

  •   Perkenalan HTML
Html adalah bahasa html markup untuk menggambarkan web dokumen (halaman web).
Html adalah singkatan dari "Hyper Text Markup Language".
Dokumen html digambarkan oleh tag html.
Setiap tag html menjelaskan konten dokumen yang berbeda.
HTML contoh:

<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>

Penjelasan:
Deklarasi doctype yang mendefinisikan jenis dokumen.
Teks antara <html>  dan </ html> menggambarkan web dokumen.
Teks antara <body> dan </body> menjelaskan isi dari halaman tersebut.
Teks antara <h> dan </h> menggambarkan judul.
Teks antara <p> dan</p> menjelaskan paragraf.




  • HTML Tag
Tag html adalah kata kunci ( tag nama ) dikelilingi oleh sudut kurung.

Tag html biasanya datang dalam pasangan seperti p dan / p.
Tag awal ini sering disebut pembukaan tag.Tag akhir ini sering disebut menutup tag.

  • Web browser
Tujuan dari web browser ( chrome, firefox, safari ) adalah untuk membaca dokumen html dan menampilkan mereka.Browser tidak menampilkan yang tag html, tetapi mereka menggunakan untuk menentukan bagaimana untuk menampilkan dokumen.



Struktur Halaman HTML
Di bawah adalah sebuah visualisasi dari sebuah struktur halaman html:
<html>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>

  • HTML editor 
mengedit html dokumen bisa menggunakan editor berikut :
  •   Adobe dreamweaver
  •   Microsoft expression web
  •   Coffecup html editor

html dokumen 
semua dokumen harus di mulai dengan tipe deklarasi : <!DOCTYPE html>
dan dokumen html dimulai dengan <html> diakhiri dengan </html> "menggunakan slash sebelum 'html' nya "
dan isi di dalam dokumen di deskripsikan dengan <body>....</body>

contoh:

<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>

Judul html : judul di deskripsikan sebagai berikut. <h1>.....</h1> hingga <h6>.....</h6>
contoh:

<!DOCTYPE html>
<html>
<body>
<p><h1>heading 1</h1></p>
   <p><h2>heading 2</h2></p>
   <p><h3>heading 3</h3></p>
   <p><h4>heading 4</h4></p>
   <p><h5>heading 5</h5></p>
   <p><h6>heading 6</h6></p>
   <p></body>
</html>

 



paragraf html:
deskripsi paragraf html adalah <p>.....</p>.
contoh:

<!DOCTYPE html>
<html>
<body>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
</body>
</html>

kita juga bisa menggunakan line break yang fungsi nya hampir sama dengan paragraf. tapi line break digunkan tanpa penutup seperti paragraf, contoh :

<!DOCTYPE html>
<html>
<body>
<p>This is<br>a para<br>graph with line breaks</p>
</body>
</html>



html image 
"image" di deskiripsikan dengan tag <img>
contoh :

<html>
<body>
<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142"></body>
</html>

Garis horizontal
untuk garis horizontal di dalam html kita bisa mengggnakan tag <hr> tanpa penutup.
contoh:

<!DOCTYPE html>
<html>
<body>
<p>The hr tag defines a horizontal rule:</p>
<hr>
<p>This is a paragraph.</p>
<hr>
<p>This is a paragraph.</p>
<hr>
<p>This is a paragraph.</p>
</body>
</html>

warna background dan text kita bisa mendeskripsikan sebagai berikut.

<body style="background-color:yellow;">
-untuk mewarnai background.

<h2 style="background-color:red;">This is a heading</h2>
<p style="background-color:green;">This is a paragraph.</p>
-untuk mewarnai text.

contoh:
<!DOCTYPE html>
<html>
<body style="background-color:yellow;">
<h2 style="background-color:red;">This is a heading</h2>
<p style="background-color:green;">This is a paragraph.</p>
</body>
</html>

Font Style
kita bisa mendeskripsikan nya sebagai berikut. contoh:

    <!DOCTYPE html>
    <html>
    <body>
    <h1 style="font-family:verdana;">A heading</h1>
    <p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p>
    </body>
    </html>


 Bold :
   Dalam html penggunaan penebalan text dapat di deskripsikan degan <b> ….</b> atau dengan <strong>….</strong>
Italic atau text miring :
   Italic dapat di deskripsikan dengan <i>….</i> atau <em>….</em>
Underline :
  Underline di desrkripsikan dengan <u>….</u>

deskripsi format text yang lain:
Tag
Deskripsi
<b>
 bold text
<em>
 emphasized text 
<i>
 italic text
<small>
 smaller text
<strong>
 important text
<sub>
 subscripted text
<sup>
 superscripted text
<ins>
inserted text
<del>
 deleted text
<mark>
 marked/highlighted text

demikian sedikit info tentang “html” yang bisa saya share, moga bermanfaat saya masih belajar, jadi jangan sungkan kalo kita saling bagi info. Mempelajari lebih mendalam kalian bisa berkunjung disiniw3school