前言
为了完成学校的综合设计作业中负责的前端项目,准备拾起八月份看的一点前端知识,接下来是CSS的部分
在html的学习中,我是用了W3school教程来看,这次发现MDN教程做的也比较不错,于是想结合着来学习
计划在这周内就简单了解CSS的性质,之后更多的在实践中应用
CSS基础教程
全称 Cascading Style Sheets 层叠样式表
基于CSS,提高html界面的工作效率。
CSS由两个部分组成: 选择器和一条或多条声明
selector{ declaration1; declaration2; ···}
选择器一般是HTML对象
例:将h1元素的文字颜色定义成红色,字体大小为14px
h1 {color:red ; font-size:14px;}
对于值,可以有不同的写法
例如颜色red
还可以写作十六进制颜色#ff0000
或者是rgb颜色值
如果值是若干单词,要写引号
多重声明
多重声明的常用格式如下
p {
text-align: center;
color: black;
font-family: arial;
}
CSS 样式
background-color
元素设置背景色
例:设置背景是灰色
p {background-color: gray;}
background-image
元素设置背景图片
body {background-image: url(/ddd/ddd/ddd);}
background-repeat
需要在页面上对背景图像进行平铺。repeat-x
表示只在水平方向重复,同理,repeat-y
是在垂直方向重复
body {
background-image: url(/ddd/ddd/ddd);
background-repeat: repeat-y;
}
background-position
改变图像在背景中的位置
常用关键字:
center
top
bottom
right
left
例如: