【零基础学习web前端】之css文字属性,背景设置，内外边框 - 苏飞论坛

[HTML] 纯文本查看 复制代码

p{

        /* 字体颜色设置,三种颜色方式*/

        color: red;

        color: #999999;

        color:rgb(0,0,255);

        /* 字体大小*/

        font-size: 20px;

        /* 字体样式：斜体、正常、倾斜*/

        font-style: italic;

        font-style: normal;

        font-style: oblique;

        /* 行高 */

        line-height: 20px;

        /* 字体正常、加粗、细体 */

        font-weight: normal;

        font-weight: bold;

        font-weight: lighter;

        /* 字体设置 */

        font-family: 宋体;

        /* 字间距 */

        letter-spacing: 2px;

        /* 字体左对齐、右对齐、居中对齐、分散对其 */

        text-align: left;

        text-align: right;

        text-align: center;

        text-align: justify;

        /* 文本修饰:下划线、加顶线、删除线、删除下划线、闪烁的文本*/

        text-decoration: underline;

        text-decoration: overline;

        text-decoration: line-through;

        text-decoration: none;

        text-decoration: blink;

        /* 首字母大写、大写字体、小写字体、无 */

        text-transform: capitalize;

        text-transform: uppercase;

        text-transform:lowercase;

        text-transform: none;                

        /* 首行缩进2个字符 */

        text-indent: 2em;

        /* 设置文本阴影效果 */

        /* 四个值分别表示：水平阴影的位置（必填）、垂直阴影的位置（必填）、模糊的距离（可选）、阴影的颜色（可选） */

        text-shadow: 5px 5px 5px #FF0000;

    }

[HTML] 纯文本查看 复制代码

 /* 背景颜色 */

        background: #999999;

        /* 背景图：背景图片路径、不重复 */

        background: #00FF00 url(bgimage.gif);

        /* 背景重复、不重复、X轴上重复、Y轴上重复 */

        background-repeat: repeat;

        background-repeat: no-repeat;

        background-repeat: repeat-x;

        background-repeat: repeat-y;

[HTML] 纯文本查看 复制代码

/* 内边距分别是以顺时针排列：上填充1px、右填充2px、下填充3px、左填充4px */

        padding: 1px 2px 3px 4px;

        /* 分别表示如下 */

        padding-top: 1px;

        padding-right: 2px;

        padding-bottom: 3px;

        padding-left: 4px;



        /* 外边距分别是以顺时针排列：上边距1px、右边距2px、下边距3px、左边距4px */

        margin: 1px 2px 3px 4px;

        /* 分别表示如下 */

        margin-top: 1px;

        margin-right: 2px;

        margin-bottom: 3px;

        margin-left: 4px;