CSS Font :)

0

Beberapa properti font yang sering di gunakan pada CSS adalah ..

1. Font Family
merupakan properti yang di gunakan untuk menentukan jenis font berdasarkan kelompoknya.

Sintaks :
selector {font-family: value}

contoh:
P{font-family : arial, helvetica,sans-serif;}

 

2. Font-size
di gunakan untuk mengatur ukuran font atau teks yang akan di gunakan. ukuran yang digunakan bisa menggunkaan satuan pixel, cm,mm atau yang lainnya. selain menggunkan angka ukuran font juga dapat di definisikan, seperti: small, x-small, xx-small, medium dan lainnya.

Sintaks:
selector{font-size: value}

 

3. Font Weight

di gunakan untuk mempertebal teks. nilai yang di atur antara lain : normal , bold , bolder , lighter , 100-900

Sintaks :
selector{font-weight: normal | bold | bolder | lighter | 100-900}

 

rekomendasi ini Jasa Pembuatan Web by Desain Web

Sintaks – Sintaks dalam CSS :)

0

ada beberapa sintaks-sintaks dalam css untuk membuat layout , di antaranya :

1. background: Untuk mengeset background. Ada beberapa sintak untuk background, yaitu:

a. background-color: yaitu warna background.
b. background-image:url(‘URLGAMBAR.jpg’); yaitu URL gambar yang dijadikan background.
c. background-repeat: bernilai “repeat”, “repeat-x”, “repeat-y”, dan “no-repeat”. Maksudnya adalah pengulangan gambar. “repeat” artinya gambar akan diulang, memenuhi layar. “repeat-x” artinya gambar akan diulang sepanjang horizontal, “repeat-y” gambar akan diulang secara vertikal, sedangkan “no-repeat” artinya gambar hanya ditampilkan 1x, tidak akan diulang.
d. background-position: nilainya “nilaihorizontal nilaivertikal”. Maksudnya adalah posisi latarbelakang dari layer (bagian div/span/element yang diberi latar). Misal: body{background-position:10px 30px} maka latar belakang dari bagian body akan diberi jarak 10 piksel antara batas pinggir kiri body dan 30piksel dari batas pinggir atas body. Anda juga bisa mengisinya dengan “top” “middle” “bottom” untuk nilaihorizontal, dan “left” “center” “right” untuk nilaivertikal (pilih salah satu).
e. background-attachment: Nilainya “fixed” dan “scroll”. “fixed” artinya tampilan gambar latar belakang akan tetap sepanjang anda meng-scroll mouse anda.Sedangkan “scroll” kebalikannya.

2. width: Nilainya berupa nilai dalam piksel atau “auto”. Untuk menentukan lebar elemen.
3. height: Idem dengan width bedanya height untuk menentukan tinggi elemen.
4. margin: Batas antara suatu element dengan elemen diluarnya. Nilainya bisa berupa auto atau nilai dalam piksel. Sintaksnya begini: margin:marginatas marginkanan marginbawah marginkiri. Atau jika nilai semua margin sama langsung saja margin: nilaimargin.
5. padding: Batas antara suatu batas (border) element dengan unsur element didalam element tersebut. Sintaksnya begini: padding:paddingatas paddingkanan paddingbawah paddingkiri. Atau jika nilai semua margin sama langsung saja padding: nilaimargin.
6. border: ada 3 unsur untuk border yaitu:

a. border-width: lebar dari border
b. border-color: warna dari border
c. border-style: gaya dari border, nilainya “solid” (biasa) “double” (dobel/dua garis) “groove” (groove) “inset” (menjorok kedalam) “outset” (menjorok keluar) “dotted” (bertitik-titik) “dashed” (bergaris-garis)

7. position: posisi, nilainya “fixed” (tetap, akan melayang terus selama anda menscroll halaman, belum didukung IE ), “static” (diam, posisi default), “relative” (tergantung objek disekitarnya), “absolute” (dihitung dari pojok kiri atas layar, hampir sama seperti fixed, tetapi tidak akan ikut melayang ketika kita men-scroll mouse) . Setelah menentukan jenis posisi, kita harus menentukan:

a. pilih (top: atau bottom: jika pilih top artinya dihitung dari atas, sedangkan bottom sebaliknya)
b. pilih (left: atau right:. jika pilih left nilai akan dihitung dari kiri, sedangkan right sebaliknya.

8. z-index: z-index adalah posisi suatu elemen dari dasar dokumen, jika tidak diset maka defaultnya 0. Misalnya ada 3 buah buku ditumpuk, maka buku terbawah mempunyai z-index 0, buku ke2 daribawah:1, dan buku teratas:2.
9. visibility: nilainya hanya 2, yaitu “visible” dan “hidden”. Visible artinya kelihatan, kalo hidden ya artinya tersembunyi.
10. display: nilainya “none” “inline” “block”. Jika none maka tidak akan ditampilkan, inline ditampilkan dalam sebaris (biasanya untuk navigasi menu horizontal) dan block akan ditampilkan secara perbaris. Untuk display “none” dan visibility “hidden” perbedaannya adalah, untuk display “none” elemen didalamnya tidak akan ditampilkan, sedangkan visibility “hidden” akan tetap ada ruang untuk elemen tersebut, namun elemennya disembunyikan. 🙂

rekomendasi ini Jasa Pembuatan Web by Desain Web

Pengertian CSS :)

0

CSS (Cascading Style Sheets). CSS merupakan bahasa yang digunakan untuk mengatur tampilan suatu dokumen yang ditulis dalam bahasa markup / markup language. Jika kita berbicara dalam konteks web, bisa di artikan secara bebas sebagai : CSS merupakan bahasa yang digunakan untuk mengatur tampilan / desain suatu halaman HTML.:)

CSS adalah singkatan dari Cascading Style Sheets. Berisi rangkaian instruksi yang menentukan bagiamana suatu text akan tertampil di halaman web.Perancangan desain text dapat dilakukan dengan mendefinisikan fonts (huruf) , colors (warna), margins (ukuran), latar belakang (background), ukuran font (font sizes) dan lain-lain. Elemen-elemen seperti colors (warna) , fonts (huruf), sizes (ukuran) dan spacing (jarak) disebut juga “styles”.Cascading Style Sheets juga bisa berarti meletakkan styles yang berbeda pada layers (lapisan) yang berbeda.CSS terdiri dari style sheet yang memberitahukan browser bagaimana suatu dokumen akan disajikan.Fitur-fitur baru pada halaman web lama dapat ditambahkan dengan bantuan style sheet.Saat menggunakan CSS, Anda tidak perlu menulis font, color atau size pada setiap paragraf, atau pada setiap dokumen. Setelah Anda membuat sebuah style sheet, Anda dapat menyimpan kode tersebut sekali saja dan dapat kembali menggunakannya bila diperlukan. 😉

Keuntungan Menggunakan CSS :
1.CSS memberikan keseragaman pada halaman web.
2.Dengan CSS dapat menghemat banyak waktu dan pekerjaan berulang. Saat menggunakan CSS, perubahan tidak perlu dilakukan dalam setiap halaman web. Anda hanya perlu membuat perubahan dalam style sheet.
3.CSS memungkinkan Anda untuk memuat halaman web Anda dengan mudah.
4.Layers (Lapisan), seperti item pop-up, dapat digunakan dalam dokumen.
5.CSS membantu Anda memelihara halaman web Anda dengan mudah dan efektif. 🙂

rekomendasi Jasa Pembuatan Web by Desain Web

Sejarah dan Perkembangan HTML :)

0

Sejarah HTML atau Hypertext Markup Language telah menjadi teknologi utama untuk Web sejak awal tahun 1990-an. Tim Berners-Lee menciptakan HTML pada tahun 1989 sebagai cara sederhana namun efektif untuk mengkodekan dokumen elektronik. Bahkan, tujuan awal dari web browser adalah untuk melayani sebagai pembaca untuk dokumen berformat HTML. Dua dekade kemudian, browser itu sendiri telah menjadi sebuah portal ke dunia media online. Itu sebabnya HTML5 tidak hanya sebagai revisi HTML, tetapi juga sebagai standar yang komprehensif untuk bagaimana halaman web bekerja. 🙂

Untuk lebih memahami apa yang membuat HTML5 unik, mari kita simak sejarah dari HTML itu sendiri. Pada tahun 1994, HTML masih dalam revisi pertama, Mosaic dan Netscape mendominasi pasar browser, dan kebanyakan orang belum familiar dengan istilah World Wide Web. Tahun itu, pencipta HTML Berners-Lee memimpin kelompok untuk membuat Web standar yang dikenal sebagai World Wide Web Consortium (W3C).

Meskipun W3C adalah kewenangan standarisasi yang diakui saat ini, para pemain komersial di pasar browser 1990 mengabaikan standar-standar ini dan merintis jalan mereka sendiri. Pada tahun 1995, W3C menerbitkan revisi kedua dari standar HTML, dan Web pendatang baru Microsoft menjadi platform browser Internet Explorer (IE).

Selama perang browser awal, para pengembang Web ditantang untuk menjaga situs mereka selalu kompatibel dengan setiap rilis baru dari browser utama. Meskipun W3C telah menerbitkan HTML 3.2 pada tahun 1997, diikuti dengan HTML 4 tahun 1998, mengikuti standar sepertinya kurang penting dibandingkan menjaga fitur browser yang disajikan pengembang. Hal ini berlangsung hingga tahun 2003 ketika komunitas berbasis Mozilla Foundation mematahkan tren. Setelah dibebaskan Browser Mozilla asli, yang diikuti oleh browser Firefox pada tahun 2004, Mozilla cepat mendominasi dibandingkan IE.

Sementara Mozilla Firefox terus berkembang menggunakan HTML 4 standar, Mozilla bergabung dengan Apple dan Opera pada tahun 2004 untuk membentuk kelompok yang disebut Web Hypertext Application Technology Working Group (WHATWG). Tujuan dari WHATWG adalah untuk menjaga perkembangan siklus HTML. WHATWG dan W3C mengkombinasikan spesifikasi yang ada untuk HTML dan XHTML untuk dikembangkan lebih lanjut dengan spesifikasi HTML 5 baru 😉

 

rekomodasi ini Jasa Pembuatan Web by Desain Web

Membuat WEB lewat HTML :))

0
Website memiliki berbagai macam fungsi mulai dari komunikasi, berbagi ilmu pengetahuan, berbagi file bahkan sampai berjualan pun dapat dilakukan dengan website. Untuk itu pada posting kali ini saya akan  menjelaskan cara membuat website hanya dengan menggunakan notepad. Karena hanya menggunakan notepad maka halaman yang tampil masih sangat sederhana. Dan materi yang saya share ini merupakan bagian dasar dari pembuatan web, untuk itu bagi anda yang sudah ahli dalam pembuatan web bersedia menambahkan jika ada kekurangan maupun kesalahan dalam penulisan.
🙂
Berikut cara pembuatanya
Pertama persiapkan aplikasi yang diperlukan yakni notepad (bisa notepad biasa tetapi lebih baik menggunakan notepad++, bisa didownload filehippo atau indowebster) dan browser internet  (saran saya dengan google chrome dan firefox)
Untuk kita pelajari pada bagian pertama adalah dengan menggunakan bahasa html.
 
tag-tag dasar yang perlu dipelajari 🙂
<html></html>                 :                  Tag untuk mengapit semua halaman HTML
<head></head>                 :                  Tag yangyang berfungsi memberikan informasi umum dari halaman
<title></title>                    :                 Judul halaman. Terdapat pada <head>
<body></body>                :                 untuk mensetting attribut keseluruhan isi halaman
<b></b>                               :                 Untuk menebalkan teks (bold)
<i></i>                                  :                 Untuk memiringkan teks (italic)
<u></u>                                :                Untuk menggaris bawahi teks (underline)
<p></p>                               :                 Untuk membuat paragraf
<font></font>                    :                Untuk memanipulasi bentuk dan ukuran huruf
<br>                                       :                 Untuk pindah ke baris baru
<hr>                                         :               Untuk membuat garis horizontal
<a></a>                                :                 Untuk membuat links (hyperlink)
·
 
🙂 Materi membuat halaman berisi judul dan artikel
1.       Buka notepad
2.       Ketik kode dibawah ini, di bawah pada notepad anda
 

<html>
<head>
<title>Upitd Uzumaki Uchiha</title>
</head>
<body>
<p>Upitd Uzumaki Uchiha</p>
<p>Namaku Fitria Febrianti .. 🙂
tapi aku lebih suka di panggil Upitd :).. banyak yang komen sehh .. tapi terserah lahh.. yang penting aku suka….aku suka buangeett sama Naruto.. ..aku punya film Naruto Shippuden mulai episode 1 sampai yang akhir” ini episode 301.. 🙂 .</p>
</body>
</html>

3.       Save as di folder terserah kamu di mana aja .. tapi aku saranin di dekstop aja biar gampang waktu buka..oiyya save dengan nama terserah tapi belakang nya di kasih “.html” kayak “Upitd.html”..
4.       buka file tadi dengan Mozilla firefox ataupu google chrome
5.       Dan hasilnya akan Nampak seperti ini 😉
 
 
gufjh
 
 
 
rekomodasi ini Jasa Pembuatan Web by Desain Web
 

Pengertian HTML :))

0

Heiii .. walau pun hari ini aku gak magang karna ikut lomba LKS , tapi aku masih mau mosting artikel ..

hari ini kitra bakal belajar tentang HTML .. apa sih HTML itu??

HTML merupakan Singkatan dari Hyper Text Markup Language, Hyper text adalah kata atau frase yang dapat menunjukkan hubungan suatu naskah dokumen dengan naskah-naskah lainnya. Jika kita klik pada kata atau frase untuk mengikuti link ini maka web browser akan memindahkan tampilan pada bagian lain dari naskah atau dokumen yang kita tuju. Pada pengertiannya di sini Markup menunjukkan bahwa pada file HTML berisi suatu intruksi tertentu yang dapat memberikan suatu format pada dokumen yang akan ditampilkan pada World Wide Web. Language atau dalam bahasa indonesia bisa di artikan ‘Bahasa’, Meski HTML sendiri bukan merupakan bahasa pemrograman, HTML merupakan kumpulan dari beberapa instruksi yang dapat digunakan untuk mengubah-ubah format suatu naskah atau dokumen.

🙂
dalam situs wikipedia, HTML atau Hyper Text Markup Language merupakan bahasa markup yang digunakan untuk membuat sebuah halaman web/situs, menampilkan berbagai informasi di dalam sebuah Penjelajah web Internet dan formating hypertext sederhana yang ditulis kedalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi. Dengan kata lain, berkas yang dibuat dalam perangkat lunak pengolah kata dan disimpan kedalam format ASCII normal sehingga menjadi home page dengan perintah-perintah HTML. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut dengan SGML (Standard Generalized Markup Language), HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web/situs. HTML bisa juga di artikan sekumpulan simbol-simbol atau tag-tag yang dituliskan dalam sebuah file yang dimaksudkan untuk menampilkan halaman pada web browser. Tag-tag tadi memberitahu browser bagaimana menampilkan halaman web/situs dengan lengkap kepada pengguna. 😉

rekomodasi ini Jasa Pembuatan Web by Desain Web