【网站定义】

什么是网站？

网站就是由多个网页联系在一起构建出来的一个整体；

什么网页？

网页就是由文字，图片和超链接组成的html文档。

制作网页的技术是什么技术？制作网页的技术是web前端标准。

【web前端标准】

web前端标准又称之为web前端技术，它是由W3C组织发布以及维护的一套技术规范。

web前端标准的官方定义：

它不是一项技术，而是一系列技术，包括如下三项：

1、结构标准— html；

2、样式标准— css;

3、行为标准— javascript；

解释：行为可以理解为功能（动画）；样式可以理解为装饰，美观；

【网页基本结构】

《认识html》

什么是html？

html超文本标记语言，（Hyper Text Markup Language）,它是写给浏览器看的一项语言，注意：不是编程语言。

html的作用？

html是负责网页的结构搭建，布局排版，对网页中信息进行控制；

《html标签语法》

html标签语言又称之为html标记语言，书写html标签需要遵循相关的语法：

1、html标签成对出现，并且区分首尾，尾标签加上关闭符号：/斜杠；

2、html语言必须写在标签符号里面：<大小于号，俗称为“尖括号”>；

《网页的基本结构》

网页的基本结构由4对标签组成：

html —表示网页的整体；

head —表示网页的头部；这里面的内容都是给浏览器去看的；

body —表示网页的主体，这里面的内容都是给用户去看的；

title —表示网页的标题，需要写在head里面；

《标签关系》

在html中，所有的标签之间只有两种关系： 一种是并列关系，一种嵌套关系；

【开发工具】

常见的开发工具有：webstorm，sublime，HB  DW.等等，每个工具都有自己的不同特色，我们可以根据自己的喜好选择开发工具。

Webstorm功能比较强大，插件特别的丰富。

Sublime小巧轻便，安装快捷，能够满足日常开发的需要。

DW偏向设计的一款开发工具，可以代码和设计相结合。

【html标签】

h1 —标题标签； 一共有6级，h1—h6

p —段落标签； 浏览器会将它内部的信息编译成一个段落；

《语义标签》

语义标签让不同的内容赋予了不同的语义；

《文字控制标签》

在文字控制中，修改需求最大的是：颜色，字号，字体，这三个需求都是通过一个标签进行控制：font标签； 修改哪部分内容就用font标签选中，然后设置它的标签属性；

标签属性的基本结构:

k=”v”例如：color=”red”

注意事项：标签属性采用键值对的基本结构；多个属性之间用空格隔开；

键值对翻译过来就是：什么是什么的意思。

font标签的文字控制三属性：

color —颜色；（它的值可以是英文名称，也可以是拾色器获取的颜色值）

size —字号大小；1-7级,最大是7；

face —字体设置；

《水平分割线标签》

hr表示水平分割线，它是一个单标签；

标签属性：

size —粗细大小； 没有限制；

color —颜色

width —宽度；

align —水平对齐方式，它的值有三个：left center right左中右 ；

注意事项：在html中，谁的属性给谁写，不能随便加！ 标题和段落是接受align属性的；

《body的属性》

bgcolor —设置背景颜色；

background —设置背景图片；

注意事项:在web前端标准中，背景颜色永远是在背景图的下面；

《bui标签和空格换行》

b —给文字加粗标签

u —下划线；

i —斜体；

表示换行标签； 快捷键：shift+enter(回车键)

表示空格的特殊字符:快捷键：ctrl+shift+space(空格键)

【图片控制标签】

图片的控制是通过img标签；

标签属性：

src —指定图片的文件路径； （必备）

width —图片宽度；

height —图片高度；

border —边框；

title —设置鼠标移上图片显示的提示文本（图片的标题）；

alt –设置图片不能正常显示的替换文本；

设置图片等比例缩放的方式：宽度或高度只修改其中一个，另外一个让计算机自动计算；

【列表标签】

《无序列表》

无序列表基本结构: ul>li

ul表示无序列表的整体；li表示列表项；ul的内部可以有无数个li;

修改列表的样式是通过type属性:

disc —小圆点（默认）

circle —小圆圈；

square —小矩形；

《有序列表》

有序列表的基本结构：

ol>li

ol表示列表整体，li表示列表项；

列表样式值: 1，a，A，i，I