[分享]CSS3常用的属性和属性值

CSS3是一个重要的技术，它为Web开发者提供了各种属性，使得设计与排版更加优雅。今天，我们将介绍CSS3中最常见的一些属性和属性值。 / 下面是常用的CSS3属性和属性值 / / 背景属性 / ba...

CSS3是一个重要的技术，它为Web开发者提供了各种属性，使得设计与排版更加优雅。今天，我们将介绍CSS3中最常见的一些属性和属性值。

 /* 下面是常用的CSS3属性和属性值 */
    /* 背景属性 */
    background: #FFF; /* 颜色 */
    background-image: url('bg.png'); /* 图片 */
    background-repeat: repeat; /* 重复方式 */
    background-position: center top; /* 图片位置 */
    background-size: cover; /* 图片大小 */

    /* 边框属性 */
    border: 1px solid #AAA; /* 边框样式 */
    border-radius: 5px; /* 圆角 */
    box-shadow: 2px 2px 5px #AAA; /* 阴影 */

    /* 文本属性 */
    color: #333; /* 文字颜色 */
    font-size: 16px; /* 字体大小 */
    font-style: italic; /* 字体斜体 */
    font-weight: bold; /* 字体粗细 */
    text-align: center; /* 文本对齐方式 */
    text-decoration: underline; /* 下划线 */

    /* 盒子属性 */
    width: 500px; /* 盒子宽度 */
    height: 300px; /* 盒子高度 */
    padding: 10px; /* 盒子内边距 */
    margin: 20px; /* 盒子外边距 */
    box-sizing: border-box; /* 盒子尺寸计算方式 */

    /* 动画属性 */
    animation: rotate 2s linear infinite; /* 动画名称，时间，速度和重复次数 */
    transform: rotate(30deg); /* 旋转 */

    /* 媒体属性 */
    @media screen and (max-width: 768px) {
        /* 屏幕最大宽度为768px时执行的样式 */
    } 

在日常的Web开发中，以上属性和属性值都非常常见。通过使用CSS3，我们可以让网页更加美观、优雅。