Newest Post

Tampilkan postingan dengan label CSS Basic. Tampilkan semua postingan
Tampilkan postingan dengan label CSS Basic. Tampilkan semua postingan

Menggabungkan Baris/Kolom pada Table HTML

|
Baca selengkapnya »

Table tidak selalu harus berbentuk kotak yang berbaris sejajar secara horizontal dan vertical, tetapi bisa juga kita buat dengan bentuk yang bervariasi, misalnya pada baris pertama berisi 1 kolom, baris kedua berisi 3 kolom dan baris ketiga berisi 2 kolom. Untuk menggabungkan Kolom kita memakai atribut colspan pada tag TD sedangkan untuk menggabungkan Baris kita memakai atribut rowspan.
Kalau anda bingung membayangkan, cobalah lihat contoh TABLE dibawah ini:
HEADER
LEFT BOXCONTENTRIGHT BOX
FOOTER
Untuk membuat Table seperti diatas, pertama anda harus lihat berapa jumlah kolom terbanyak pada Table kemudian digabungkan menjadi 1 kolom. pada kasus diatas, kolom terbanyak adalah 3, kemudian kita buat kodenya seperti berikut:

Menggabungkan Baris/Kolom pada Table HTML

Posted by : Alfa
Date :
With 0komentar
Tag :
Baca selengkapnya »
Category | 0 komentar

Mengatur Display dengan CSS

|
Baca selengkapnya »
trik dan tips for web dan blog
CrackedEarth0018_5_S
Properti Display, befungsi untuk mengatur tampilan suatu elemen pada browser. Nilai nilai yang dapat ditulis pada properti display adalah: inline, block, list-item, run-in, inline-block, compact, inline-table, marker, table, table-caption, table-cell, table-column, table-row, table-footer-group, table-header-group, table-column-group, table-row-group, inherit dan none.

contoh:

Mengatur Display dengan CSS

Posted by : Alfa
Date :
With 0komentar
Tag :
Baca selengkapnya »
Category | 0 komentar

Mengatur Padding dengan CSS

|
Baca selengkapnya »
Properti Padding, adalah Trik berfungsi untuk mengatur jarak antara border dengan content pada sebuah elemen HTML.
Padding pada css sangat penting gunanya dalam hal membuat halaman website, maka dari itu saya menyarankan agar anda benar-benar memperhatikan sintak css ini.

Cara penulisan properti padding, hampir sama dengan cara penulisan properti margin, yaitu:

Mengatur Padding dengan CSS

Posted by : Alfa
Date :
With 1 komentar:
Tag :
Baca selengkapnya »
Category | 1 komentar

Mengatur Margin dengan CSS

|
Baca selengkapnya »
Properti Margin pada CSS berfungsi untuk mengatur  batas antara border dengan sisi selector pada sebuah elemen.
Cara penulisan properti margin, hampir sama dengan cara penulisan properti padding, yaitu:

Mengatur Margin dengan CSS

Posted by : Alfa
Date :
With 0komentar
Tag :
Baca selengkapnya »
Category | 0 komentar

CSS Font dan Text

|
Baca selengkapnya »
Properti Font berfungsi untuk mengatur font pada suatu elemen HTML, baik itu jenisnya,ukurannya,gayanya ataupun variasinya.
Ada beberapa macam properti Font antara lain:

CSS Font dan Text

Posted by : Alfa
Date :
With 0komentar
Tag :
Baca selengkapnya »
Category | 0 komentar

ID Selector dan Class

|
Baca selengkapnya »
Selain dengan cara tips dan trik standar dalam penulisan CSS yaitu memberi style atau properti pada selector bawaan HTML, kita juga dapat memberikan nama sendiri pada suatu elemen tertentu dengan cara membuat ID Selector dan Class Selector.
ID Selector adalah selector yang dapat digunakan hanya satu kali pada suatu elemen, sedangkan Class Selector dapat digunakan beberapa kali pada suatu elemen.
Penulisan ID Selector pada CSS diawali dengan simbol # (octothorpe) sedangkan penulisan Class Selector pada CSS diawali dengan tanda titik (.)

Contoh:

ID Selector dan Class

Posted by : Alfa
Date :
With 0komentar
Tag :
Baca selengkapnya »
Category | 0 komentar

CSS Border

|
Baca selengkapnya »
Properti Border adalah untuk membuat garis pinggir pada suatu elemen.
Ada beberapa properti pada Border sebagai berikut:

CSS Border

Posted by : Alfa
Date :
With 0komentar
Tag :
Baca selengkapnya »
Category | 0 komentar

CSS Background

|
Baca selengkapnya »
Properti Background adalah untuk membuat efek latar belakang pada sebuah element pada web / blog.
Ada beberapa macam properti pada Background sebagai berikut:

CSS Background

Posted by : Alfa
Date :
With 2komentar
Tag :
Baca selengkapnya »
Category | 2 komentar

Format Dasar CSS

|
Baca selengkapnya »
Kalau kita perhatikan secara seksama sebetulnya hasil terjemahan bahasa HTML pada browser adalah berbentuk Kotak, didalam kotak tersebut dapat dibagi menjadi beberapa area seperti Content, Padding, Border, dan Margin.
Dari masing-masing area tersebut dapat diformat dengan menggunakan CSS style.
Untuk memperjelas apa yang disampaikan diatas tentang Format CSS, lihat ilustrasi dibawah ini: tutorial

Format Dasar CSS

Posted by : Alfa
Date :
With 0komentar
Tag :
Baca selengkapnya »
Category | 0 komentar

Cara Meletakkan CSS

|
Baca selengkapnya »
Secara umum ada 3 cara untuk meletakan CSS kedalam kode HTML yaitu :
  • Pertama: Inline Stylesheet yaitu Meletakan atau memberi property secara langsung kedalam tag HTML yang ada diantara <body>……</body>.
    contoh:
<body>
<p style=”color:#ff0000″>Belajar CSS</p>
</body>
  • Kedua: Internal Stylesheet yaitu Meletakan elemen CSS diantara tag STYLE didalam tag HEAD.
    contoh :
<head>
<style type=”text/css”>
p {color:#ff0000;}
</style>
</head>

Cara Meletakkan CSS

Posted by : Alfa
Date :
With 0komentar
Tag :
Baca selengkapnya »
Category | 0 komentar

Kelebihan dan Kelemahan CSS

|
Baca selengkapnya »
CSS adalah singkatan dari Cascading Style Sheet.
CSS adalah suatu Style khusus untuk memformat halaman HTML menjadi lebih menarik yang tidak bisa dilakukan oleh tag-tag HTML saja.
CSS sudah di standarisasi oleh W3C, sehingga dapat dijalankan pada semua browser ternama.

Kelebihan CSS:
  1. Dengan CSS, anda akan dapat mempersingkat waktu kerja anda untuk membuat halaman Web.
  2. Ukuran File HTML akan menjadi lebih kecil, karena file CSS berada diluar HTML (kalau menggunakan External Stylesheet).
Kelemahan CSS
Tidak semua browser mengartikan kode CSS dengan cara yang sama. Jadi kadang-kadang, tampilan web dengan CSS terlihat baik di browser yang satu, tapi berantakan di browser yang lain. Jadi anda harus memeriksa tampilan supaya terlihat baik di semua browser dan menambahkan kode-kode khusus browser tertentu jika memang dibutuhkan agar tampilan web anda terlihat baik di semua software browser.

Kelebihan dan Kelemahan CSS

Posted by : Alfa
Date :
With 1 komentar:
Tag :
Category | 1 komentar

Cara Penulisan CSS

|
Baca selengkapnya »
Ada 3 bagian penting dalam syntax atau cara penulisan pada CSS yaitu:
Selector {property1: value1; property2:value2;}
  • Selector, adalah merupakan tag HTML seperti (div, p, span, table, td, th, dan seterusnya..)
    Tag tag inilah yang akan diberi efek oleh property dan value-nya sehingga format apapun yang kita inginkan bisa diwujudkan dengan CSS.
    Coba anda perhatikan contoh dibawah ini:

<style type=”text/css”>
p: {color:red;}
</style>
Dari contoh diatas, yang menjadi selector adalah tag P, tag P merupakan tag HTML yang membentuk sebuah paragraf pada Web Browser, jadi ketika P diberi property (color) dan value-nya (red), maka yang terjadi pada Web Browser adalah sebuah paragraf dengan teks berwarna merah.
  • Property:Value, merupakan inti dari style yang menentukan efek dari Selector, apakah anda ingin selector tersebut punya background color?,background image?, bergaris bawah?, atau bergaris atas?.
    Dari contoh diatas, yang menjadi Property adalah color, property harus diletakan ditengah tengah tanda {…} sedangkan yang menjadi value adalah tutorial red.
    Diantara property dengan value dipisahkan oleh tanda titik dua (:) sedangkan untuk memisahkan antara property dalam satu style definition, kita menggunakan tanda titik coma (;) setelah Value.
    Contoh:
p {color:#FFFFFF;
padding-top:10px;

Cara Penulisan CSS

Posted by : Alfa
Date :
With 0komentar
Tag :
Category | 0 komentar

Pengenalan CSS

|
Baca selengkapnya »
Bagi anda yang betul betul ingin menekuni Web/ Blog sebagai Web Designer, menguasai CSS adalah suatu keharusan.
Tanpa CSS, seorang Web Designer akan kesulitan dalam hal merancang halaman web, apalagi jumlah halaman yang dibuat mencapai 10 halaman atau lebih. Bayangkan berapa banyak waktu yang akan anda butuhkan untuk membuat warna latar belakang yang sama pada setiap halaman web?.
Tetapi jika anda menguasai ilmu CSS dan Trik lainnya,waktu dibutuhkan sangatlah singkat untuk membuat warna latar belakang yang sama disetiap halaman web anda. Cukup dengan meng Edit satu file saja akan menghasilkan perubahan pada semua halaman web.
Ini merupakan sebuah Investasi waktu bagi anda jika anda mampu menguasai CSS dengan baik.
Sebelum anda ingin belajar CSS lebih lanjut, sangat disarankan agar anda belajar HTML/XHTML terlebih dahulu agar anda mengerti apa yang saya terangkan selanjutnya, karena anda akan banyak menemukan code-code HTML dalam mempelajari CSS.

Pengenalan CSS

Posted by : Alfa
Date :
With 1 komentar:
Tag :
Category | 1 komentar
← Prev
Rss: Top
▲Top▲