Your SlideShare is downloading. ×
Css layout
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Css layout

206
views

Published on

Published in: Technology, Design

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
206
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
7
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Pemrograman InternetSuprayogi,S.KomMembuat Layout menu dengan CSSLangkah 1Membuat file index.html dan style1.css, kemudian jalankan file index.html tersebut padabrowser IEScript 1script 2 (style1.css)gb1
  • 2. Pemrograman InternetSuprayogi,S.KomLangkah 2Menambahkan box header pada halaman webScript 3script 4 (style1.css)Gb2.
  • 3. Pemrograman InternetSuprayogi,S.KomLangkah 3Menambahkan style teks pada halaman webScript 5Script6 (style1.css)Gb 3
  • 4. Pemrograman InternetSuprayogi,S.KomLangkah 4Menambahkan box navigasi kanan dan atas pada halaman webScript 7Script 8 (style1.css)
  • 5. Pemrograman InternetSuprayogi,S.KomGb4
  • 6. Pemrograman InternetSuprayogi,S.KomLangkah 6Menambahkan box content dan link pada halaman webScript 9Scrip 10 (style1.css)#box_content padding-right:0px; { padding-bottom:3px; background-color:olive; padding-left:10px; position : absolute; text-decoration:none; } height:450px; #stylelink a:hover width:700px; { left:50px; border-bottom:1px solid #cccccc; top:148px; height:25px; padding:1em; background-color:maroon; border-left-width:1px; background-image:none; border-left-style:dotted; font-size:8pt; border-left-color:#666666; text-decoration:none; border-right-width:1px; color:#ffffff; } border-right-style:dotted; #stylelink_top a:link border-right-color:#666666; } {#stylelink a:link border-bottom:1px solid #cccccc; { background-color:cyan; display:block; font-size:10pt; border-bottom:1px solid #cccccc; color:maroon; background-color:#606060; height:25px; font-size:8pt; width:100px; color:#ffff00; padding-top:3px; height:25px; padding-right:0px; width:100px; padding-bottom:3px; padding-top:3px; padding-left:10px; padding-right:0px; text-decoration:none; } padding-bottom:3px; #stylelink_top a:visited padding-left:10px; { text-decoration:none; } border-bottom:1px solid #cccccc;#stylelink a:visited background-color:cyan; { font-size:10pt; display:block; color:maroon; border-bottom:1px solid #cccccc; height:25px; background-color:#606060; width:100px; font-size:8pt; padding-top:3px; color:#ffff00; padding-right:0px; height:25px; padding-bottom:3px; width:100px; padding-left:10px; padding-top:3px; text-decoration:none; }
  • 7. Pemrograman InternetSuprayogi,S.KomGb 5 Gambar Hasil akhir Layout menggunakan CSS