第4课 设置网页文字样式(视频)

视频课程

网页中编写CSS代码

什么是CSS？ 

层叠样式表Cascading Style Sheets的缩写，用来定义网页上内容的样式（字体、颜色、边框、背景、间距等等）。

CSS代码写在哪里？

必须写在的<style></style>标记之间，而<style>标记一般是写在网页头部。

CSS代码怎么写？

自己定义一个CSS样式

  .样式名{css属性:值;css属性:值; ......}

例如： .aa{color:red;font-size:18px;font-family:微软雅黑}

样式名自己决定，可以用英文字母开头，后面可加数字和“-”和“_”字符。每一句css代码以;结束

将自定义的css样式应用到HTML标记上

任何一个HTML标记上都可以加一个class属性，取值为css样式名。

<标记 class="css样式名">

一个标记上可以同时加多个css样式，例如：<p class="a b">

设置文字颜色、大小、字体

设置文字颜色，用CSS属性：color

取值：某种颜色的英文单词
例如：color:blue;

设置文字大小，用CSS属性：font-size

取值：整数，后面加px作为单位，px代表像素。
例如：font-size:50px   表示文字的高度为50个像素。

设置文字字体，用CSS属性：font-family

取值：系统中已经安装的字体名，例如：font-family:微软雅黑;
电脑中已经安装了哪些字体？   可打开记事本的主菜单“格式”-“字体”可以查看。

设置文本排列方式，用CSS属性：text-align

取值：left  左对齐   right 右对齐   center 居中对齐

使用notepad++编辑器编写网页代码

下载安装Notepad++

百度搜索“Notepad++下载”，最好找官网下载，官网是英文网站。

为什么要使用notepad++这个软件写代码？

可以使你写代码更轻松，主要有：

• 代码高亮显示
• 显示行号
• 代码自动提示
• 高亮显示头尾
• 代码折叠

文件的编码

用notepad++创建网页文件时，要注意网页文件的存储编码，必须和HTML中指定的字符集相匹配，否则会出现乱码。

一般来说，我们只需要用到gbk和utf-8这个两种字符集。

网页上只有中文和英文，可以选择gbk，网页上有多国语言文字，必须选择utf-8。

<meta charset="utf-8">