首页 话题 小组 问答 好文 用户 我的社区 域名交易 唠叨

[分享]css3常见的样式属性及其用法

发布于 2024-11-11 15:23:56
0
33

CSS3是最新的CSS规范,拥有许多强大的样式属性,下面是一些常见的样式属性及用法:

/* 选择器 */
p {
    color: #333;
    font-size: 16px;
    font-weight: bold;
}

/* 颜色 */
color: #333; /* 文字颜色 */
background-color: #fff; /* 背景颜色 */

/* 字体 */
font-size: 16px; /* 字体大小 */
font-family: Arial, sans-serif; /* 字体类型 */
font-weight: bold; /* 字体加粗 */
text-decoration: underline; /* 下划线 */
text-transform: uppercase; /* 文本大写 */
text-align: center; /* 文本居中 */

/* 边框 */
border: 1px solid #333; /* 边框大小、样式、颜色 */
border-radius: 5px; /* 圆角边框 */
box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.5); /* 盒子阴影 */

/* 背景 */
background-image: url(bg.jpg); /* 背景图 */
background-repeat: no-repeat; /* 背景不重复 */
background-size: cover; /* 背景铺满 */

/* 渐变 */
background: linear-gradient(#333, #999); /* 线性渐变 */
background: radial-gradient(#333, #999); /* 径向渐变 */

/* 动画 */
animation: fade-in 1s ease-in-out; /* 淡入动画 */
@keyframes fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* 过渡 */
transition: all 1s ease-in-out; /* 全部属性过渡 */ 

以上是CSS3常见的样式属性及用法,它们可以让网页设计更加丰富多彩,提高用户体验。

评论
一个月内的热帖推荐
91云脑
Lv.1普通用户

62849

帖子

14

小组

291

积分

赞助商广告
站长交流