CSS学习总结
CSS是级联样式表（Cascading Style Sheets）的缩写，CSS是基于html的进一步学习，html用于撰写页面的内容，是一门美化网页的技术，可以让你所写的html页面内容按照你心中想的格式初步实现在网页上现实出来。使用CSS设置样式，可以让展示数据的HTML代码和设置样式的CSS代码进行分离，以此增强网页的展示能力。
在上一部分html学习中，已经初步掌握了静态网页的制作，但是就这样做出来显示的网页效果却很丑，这部分，通过CSS的学习，我掌握了一些基本的网页美化知识。但是这对实际网页的应用制作还不够，继续期待下一部分内容的学习。
网页中一些内容的颜色、尺寸、对齐
文本颜色
<h3 style="color:Tomato;">Hello World</h3>
<p style="color:DodgerBlue;">Lorem ipsum dolor sit, amet consectetur adipisicing elit.</p>
<p style="color:MediumSeaGreen;">Ad facilis est ducimus rem consectetur, corporis omnis, eveniet esse dolor molestiae numquam odio corrupti, sed obcaecati praesentium accusamus? Tempora, dolor a?</p>
尺寸
.example-1 {
width: 100%;
height: 200px;
background-color: powderblue;
text-align: center;
}
.example-2 {
height: 100px;
width: 500px;
background-color: rgb(73, 138, 60);
text-align: right;
}
对齐
对于元素中的文本，我们可以简单的设置text-align属性为left, center, right即可
盒子模型
盒子模型指的是一个 HTML 元素可以看作一个盒子。从内到外，这个盒子是由内容 content, 内边距 padding, 边框 border, 外边距 margin构成的。无论边框、内边距还是外边距，它们都有上下左右四个方向。
浮动
在一个区域或容器内，我们可以设置float属性让某元素水平方向上向左或右进行移动，其周围的元素也会重新排列。比如设置让图片向右浮动，后面的元素会围绕这个图片，这个在平常的网页制作中比较实用。
<html>
<head>
<style>
.example-float-right {
float: right;
}
</style>
</head>
<body>
<img src="https://mdbootstrap.com/img/Photos/Others/placeholder1.jpg" class="example-float-right" alt="">
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Quidem, architecto officiis, repellendus
corporis obcaecati, et commodi quam vitae vel laudantium omnis incidunt repellat qui eveniet fugiat totam
modi nam vero!</p>
</body>
</html>
不透明度
透明度在图片的应用中比较常用，也是一个重要内容。可以用opacity对任何元素设置不透明度，值在[0.0～1.0]之间，值越低，透明度越高。
952
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
