html & css

Border-radius: create rounded corners with CSS3!

W3C has offered some new options for borders in CSS3, of which one is border-radius. Both Mozila/Firefox and Safari 3 have implemented this function, which allows you to create round corners on box-items. This is an example:

Mozilla/Firefox and Safari 3 users should see a nicely rounded box, with a nicely rounded border.

The code for this example above is actually quite simple:

<div style=" background-color: #ccc;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: 1px solid #000;
padding: 10px;" >

These different corners can also each be handled on their own, Mozilla has other names for the feature than the spec says it should have though, as it has f.i. -moz-border-radius-topright as opposed to -webkit-border-top-right-radius:

Mozilla/Firefox and Safari 3 users should see a box with a rounded left upper corner. Mozilla/Firefox and Safari 3 users should see a box with a rounded right upper corner. Mozilla/Firefox and Safari 3 users should see a box with a rounded left lower corner. Mozilla/Firefox and Safari 3 users should see a box with a rounded right lower corner.

These are handled by / should be handled by:

  • -moz-border-radius-topleft / -webkit-border-top-left-radius
  • -moz-border-radius-topright / -webkit-border-top-right-radius
  • -moz-border-radius-bottomleft / -webkit-border-bottom-left-radius
  • -moz-border-radius-bottomright / -webkit-border-bottom-right-radius

Sumber : http://www.css3.info

XHTML yang valid di W3C

Berikut ini code xhtml yg valid di w3c :

  • Penulisan tag harus huruf kecil, contoh: <a>,<p>, <br />.
  • Setiap tag <> yang tanpa ada akhiran </> selalu menggunakan “/” pada setiap akhir sebelum “>”. Contoh: <input type=”text” id=”" name=”" />, <br />.
  • Untuk file flash tidak lagi menggunakan <embed></embed>, cukup menulikan seperti: <object width=“145″ height=“146″ type=“application/x-shockwave-flash” data=“file.swf”> <param name=“movie” value=“file.swf” /> <param name=“quality” value=“high” /> <param name=“wmode” value=“transparent” /> </object>
  • Pada awal code html  : <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> <html xmlns=“http://www.w3.org/1999/xhtml”>
  • Selalu gunakan petik ganda (“”).

Demikian kurang lebih sedikit tentang xhtml, klo ada kurang maafin aja namanya jg masih belajar, he he he.