分类目录归档:CSS

CSS基础与技巧。

九个常用的CSS属性

一、圆角效果

HTML5的优势之一,就是之前必须用图片实现的元素,现在可以用代码来实现。“border-radius”是实现这一功能的一个重要的属性,可以用来直接定义HTML元素的圆角,并且被所有现代浏览器支持。

CSS代码

[css]border-radius: 10px; /* CSS3 Property */
-moz-border-radius: 10px; /* Firefox */
-webkit-border-radius: 10px; /* Chrome/Safari */
-khtml-border-radius: 10px; /* Linux browsers */[/css]

二、阴影效果

通过CSS3的box-shadow属性可以非常方便地实现阴影效果。

CSS代码

[css]#myDiv{
-moz-box-shadow: 20px 10px 7px #ccc;
-webkit-box-shadow: 20px 10px 7px #ccc;
box-shadow: 20px 10px 7px #ccc;
}[/css]

三、@media属性

Media属性用于设置同一样式表在不同屏幕下的样式,可以在属性值中指定应用此样式的介质或媒体。

CSS代码

[css]@media screen and (max-width: 480px){
/* 网页在宽度为480px屏幕上的显示样式 */
}[/css]

也可以使用@media print属性指定打印预览的样式:

[css]@media print
{
p.content { color: #ccc }
}[/css]

阅读全文