CSS3 contine caracteristici care permit crearea de colturi rotunjite, umbre la chenare si folosirea unei imagini pentru aspectul bordurii.
border-radius
permite crearea cu usurinta a colturilor rotunjite in designul elementelor, fara a fi nevoie de imagini sau mai multe tag-uri <div>.<style> #id1 { width:300px; height:120px; border:2px solid blue; border-radius:28px; text-align:center; } </style> <div id="id1"> Curs CSS - marplo.net</div>
<style> #id1 { width:300px; height:120px; background-color:#bbfeda; border:2px solid blue; border-top-left-radius:20px; border-bottom-right-radius:38px; text-align:center; } </style> <div id="id1"> Curs CSS - marplo.net</div>
box-shadow
se foloseste pentru a adauga umbre la chenare. Este recunoscuta in IE9+, Firefox 4, Chrome, si Opera.elm { box-shadow: X_offset Y_offset blur marime culoare inset; }- elm - este elementul HTML la care se aplica aceasta proprietate.
<style> #id1 { width:300px; height:120px; background-color:#bbfeda; box-shadow: 11px 11px 5px #7878da; -webkit-box-shadow: 11px 11px 5px #7878da; /* Safari si Chrome */ } </style> <div id="id1"> CSS3 box-shadow, www.coursesweb.net/css/</div>
border-image
se poate folosi o imagine pentru aspectul bordurii.elm { border-image: url_img slice width outset repeat; }- url_img - adresa si numele imaginii folosita pt. bordura.
- Ca sa functioneze, este necesar sa adaugati si proprietatea: border
cu valoarea "transparent" la culoare.
- border-image e recunoscut in Internet Explorer 11+.
<style> #id1 { width:200px; height:120px; border: 12px solid transparent; border-image:url('css/border_image.png') 30 30 round; } #id2 { width:200px; height:120px; border: 15px solid transparent; border-image:url('css/border_image.png') 30 30 stretch; } </style> <div id="id1"> CSS3 border-image, with round</div><br> <div id="id2"> CSS3 border-image, with stretch</div>
<table></tr> <td>Cell-1</td><td>Cell-2</td> </tr></table>
h3 { background-image: url("image.jpg"); }
var arr = [1, "ab", "CoursesWeb.net"]; for(var i=0; i< arr.length; i++) { alert(arr[i]); };
$arr =["k1"=>"v1", "k2"=>"v2", "k3"=>"v3"); foreach($arr AS $k => $v) { echo "<br/>". $k ." - ". $v; }
He is so kind and meek. - El este atat de amabil si bland.
Tu padre tiene un carácter muy manso. - Tatal tau are un caracter foarte bland.