Web前端开发
什么是 Web ？
-
Web：全球广域网，也称为万维网(www World Wide Web)，能够通过浏览器访问的网站。
Web 网站的工作流程
W3C
-
万维网联盟（ World Wide Web Consortium ），创建于1994年10月，主要工作是对 web 进行标准化。
HTML
快速入门
什么是HTML?
-
HTML（HyperText Markup Language）：超文本标记语言
-
超文本：超越了文本的限制，比普通文本更强大。除了文字信息，还可以定义图片、音频、视频等内容。
-
标记语言：由标签构成的语言
-
HTML标签都是预定义好的。例如：使用<a>展示超链接，使用<img>展示图片，<video>展示视频。
-
HTML代码直接在浏览器中运行，HTML标签由浏览器解析。
HTML快速入门
-
新建文本文件，后缀名改为 .html
-
编写 HTML 结构标签
-
在<body>中填写内容
基础标签
基础文本标签
超链接
-
<a>：定义超链接，用于链接到另一个资源
-
常见属性 ： href：指定访问资源的URL，支持绝对路径和相对路径两种写法 target：self，默认值，在当前页面打开；blank，在空白页面打开
图片、音频、视频标签
布局标签
布局标签
容器
-
<div>定义HTML文档中的一个区域部分，经常与CSS一起使用，用来布局页面。
-
<span>用来组合行内元素。
表格
-
<table>：定义表格 border：规定表格边框的宽度 width：规定表格的宽度 cellspacing：规定单元格之间的空白 <tr>：定义行 align：定义表格行的内容对齐方式 <td>：定义单元格 <th>：定义表头单元格
表单标签
表单标签
表单
-
表单：在网页中主要负责数据采集功能，使用<form>标签定义表单。
-
表单项：不同类型的 input 元素、下拉列表、文本域等。 <input>：定义表单项，通过type属性控制输入形式 <select>：定义下拉列表
<textarea>：定义文本域
表单属性
-
action：规定当提交表单时向何处发送表单数据，URL
-
method：规定用于发送表单数据的方式 get：浏览器会将数据直接拼接在表单的提交的 URL 之后，大小有限制 post：浏览器会将数据放到http请求消息体中，大小无限制
表单标签-表单项
表单项
-
<input>：表单项，通过type属性控制输入形式。
-
<select>：定义下拉列表，<option> 定义列表项。
-
<textarea>：文本域
CSS
快速入门
什么是CSS?
-
CSS（Cascading Style Sheet）：层叠样式表，用于控制页面的样式（表现）。
-
层叠样式是指对同一个HTML标签添加多种不同的样式（字号、字体、颜色等等），所有样式会叠加在一起展示出效果
CSS引入方式
-
行内样式：在标签内部，使用style属性，属性值就是css属性键值对。
<div style="color: red; font-size: 50px; "> Hello CSS </div>
-
内部样式：定义<style>标签，在标签内部定义css样式。
-
<style> div { color: red; font-size: 50px; } </style>
外部样式：定义<link>标签，引入外部的css文件。
-
<link rel="stylesheet" href="css/demo.css">
-
CSS样式使用优先级: 行内样式 > 内部和外部样式(内部和外部样式，后面覆盖前面的)
选择器
CSS选择器
-
概念：选择器是选取需设置样式的元素（标签）
div { color: red; }
-
分类
样式
CSS属性
-
参考官方文档：CSS 参考手册
