71muke?v=1
在线看书
立即购买

第一章 前言

收起
2024-07-17更新,每天更一篇

第二章 CSS3是什么?

收起
2024-07-17更新,每天更一篇

第三章 CSS基本语法

收起
2024-07-17更新,每天更一篇

第四章 CSS选择器

收起
2024-07-17更新,每天更一篇

第五章 文本样式

收起
2024-07-17更新,每天更一篇

第六章 背景与边框

收起
2024-07-17更新,每天更一篇

第七章 盒子模型与布局

收起
2024-07-17更新,每天更一篇

第八章 CSS3基础实战

收起
2024-07-17更新,每天更一篇

CSS3的属性和值

CSS3属性和值是用于定义和控制HTML元素样式的基本组成部分。属性是样式规则的关键字,用于设置特定的样式效果,而值是赋予属性的具体效果参数。

1. CSS属性

CSS属性用于指定HTML元素的样式。每个属性都有其特定的功能,例如设置颜色、字体、边距、布局等。常见的CSS属性包括colorfont-sizemarginpaddingborderwidthheight等。

2. CSS值

CSS值是赋予CSS属性的具体数值或参数,用于定义该属性的具体效果。例如,color属性可以有red#ff0000rgb(255,0,0)等值。

常见CSS属性及其值的示例

1.颜色属性

color:设置文本颜色。

p {
    color: red; /* 使用颜色名称 */
    color: #ff0000; /* 使用十六进制值 */
    color: rgb(255, 0, 0); /* 使用RGB值 */
}

background-color:设置背景颜色。

div {
    background-color: lightblue; /* 使用颜色名称 */
    background-color: #add8e6; /* 使用十六进制值 */
    background-color: rgba(173, 216, 230, 0.5); /* 使用RGBA值 */
}

2.字体属性

font-size:设置字体大小。

h1 {
    font-size: 24px; /* 使用像素值 */
    font-size: 2em; /* 使用相对于父元素字体大小的倍数 */
    font-size: 150%; /* 使用相对于父元素字体大小的百分比 */
}


补充使用:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>CSS中的属性和值的使用</title>
    <style>
        /* *在计算机中除了可以表达 乘法之外,还可以表达 选择所有 */
        *{
            /* ctrl+/ 生成注释: 外间距 */
            margin:0; 
            /* 内间距 */
            padding:0;
        }
        .box{
            /* background就是属性,右边是值 */
            background:#eee;
        }
        h1{
            background:red;
        }
    </style>
</head>
<body>
    <!-- 所有的HTML标签用的时候都会自带间隔 -->
    <!-- 容器,什么效果都没有 -->
    <div class="box">
        <h1>71muke网上线了</h1>
        <p>这是一段!!</p>
        <p>这是一段!!</p>
        <p>这是一段!!</p>
        <p>这是一段!!</p>
        <p>这是一段!!</p>
    </div>

</body>
</html>


除此之外还有文本属性、布局属性,后续都会学习。

留言

发布留言

需要购买本课才能留言哦~

{{ item.createtime | dateStr }}
×