携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第17天,点击查看活动详情
概念
CSS基本概念
CSS(Cascading Style Sheets)即层叠样式表,它是一种用来为结构化文档(例如HTML文档或XML应用)添加样式的计算机语言,目前由W3C定义和维护。
在前端网页开发中,我们使用CSS来定义网页元素的样式,例如背景颜色、字体展示、元素位置、动画效果等等。
所以,HTML 与 CSS 结合,将网页的内容与样式分离,有利于提高开发效率。
基本的CSS语法如同积木一般,通过各种变换设计,构成了丰富多彩的网页世界。
body背景颜色为蓝绿色(teal);h1标题的字体颜色为白色(white),字体大小为36px并且在网页中居中对齐。
CSS基础语法
一般而言,CSS要如何指定HTML元素样式呢?CSS的基础语法是什么的呢?
由上面的实例,我们可以看出CSS语法主要包括两部分:选择器和声明。
基本格式如下:
选择器 {声明1}
选择器
选择器是什么呢?
选择器用于指定我们要修改的HTML元素。例如,在上述实例中,body和h1就是选择器。在之后的实训中,我们也会学习使用多种更复杂的选择器。
声明
声明是什么呢?
通过声明,我们定义要改变的元素样式。声明由属性和值构成,包含在花括号中,基本格式如下:
{属性: 值;}
样式引入方式
CSS样式有三种引入方式:
- 内部样式表:如同之前实例中所示,在文档头部中引入;
- 外部样式表:通过外部文件引入;
- 内联样式:直接在特定元素中引入。