មេរៀនទី៣: កូដស្ទាយ CSS3

មេរៀនទី៣: កូដស្ទាយ CSS3  

Style CSS មកជម្រាបជូន ដោយសារ​តែ​ការបង្កើត​គេហទំព័រ ទាម ទារជាចាំបាច់នូវ CSS ដើម្បីបន្ថែម និងលើករូបរាង ព្រម ទាំង ទាក់ទាញ​អ្នកទស្សនា ឲ្យចង់មើល ឬចង់បានគំរូតាម ជាដើម ។ ធ្វើការលើកយក​ CSS3 មកធ្វើការបង្ហាញជូន ដែលអាចមាននាទីជំនួស JQuery បាន ដូចខាងក្រោម៖
១. ការដាក់ស្រមោលលើប្រអប់ (Box Shadow)
div.shadow {
width: 300px;
margin: 20px;
border: 1px solid #ccc;
padding: 10px;
}

div.shadow:hover {
-moz-box-shadow: 0 0 5px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 0 5px rgba(0,0,0,0.5);
box-shadow: 0 0 5px rgba(0,0,0,0.5);

២.ការកំណត់ភាពច្បាស់ (Opacity)
img.opacity {
opacity: 0.5;
filter: alpha(opacity=50);
}

img.opacity:hover {
opacity: 1;
filter: alpha(opacity=100);
ហើយប្រសិនបើ​លោកអ្នក ចង់ឲ្យវាធ្វើការ Smooth ល្អនោះ សូមវាយកូដ CSS ដូចក្រោម
    img.opacity {
opacity: 0.5;
filter: alpha(opacity=50);
-webkit-transition: opacity 1s linear;
}

img.opacity:hover {
opacity: 1;
filter: alpha(opacity=100);
-webkit-transition: opacity 1s linear;