这是我参与「第四届青训营 」笔记创作活动的第2天

什么是CSS

用来定义页面元素的样式

• 设置字体和颜色
• 设置位置和大小
• 添加动画效果

页面中如何使用CSS

• 外链 <link rel="stylesheet" href="/chuangzuo/style.css">
• 嵌入 <style> li { list-style:none; } </style>
• 内联 <p style="margin:lem 0">content</p>

CSS是如何工作的

文本属性

属性	说明
color	文本颜色
text-align	文本对齐
text-decoration	文本修饰
spacing	间距
white-space	控制空白符

padding

指定元素四个方向的内边距，百分数相当于容器的宽度

margin

指定元素四个方向的外边距

两者设置共同点：

边距	个数	说明
5px	1个值	四个方向值都为5px
5px 10px	2个值	上下5px 左右10px
5px 10px 15px	3个值	上5px 左右10px 下15px
5px 10px 15px 20px	4个值	上5px 右10px 下15px 左20px

border

三种属性

• border-widthborder-width：1px 2px 3px 4px;
• border-styleborder-style:solid;
• border-color border-color: green

css三角

通过设置边框不同颜色，宽度，例如：想要得到上面红色三角，可以将其它三边设置为透明色