CSS3的属性和值
CSS3属性和值是用于定义和控制HTML元素样式的基本组成部分。属性是样式规则的关键字,用于设置特定的样式效果,而值是赋予属性的具体效果参数。
1. CSS属性
CSS属性用于指定HTML元素的样式。每个属性都有其特定的功能,例如设置颜色、字体、边距、布局等。常见的CSS属性包括color、font-size、margin、padding、border、width、height等。
2. CSS值
CSS值是赋予CSS属性的具体数值或参数,用于定义该属性的具体效果。例如,color属性可以有red、#ff0000、rgb(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>除此之外还有文本属性、布局属性,后续都会学习。
毕设系统定制、课程教学、问题1对1远程解答,可联系村长QQ:330168885
需要购买本课才能留言哦~