目录
一、什么是前端
前端工程师：技术栈HTML+CSS+JAVAScript 基础
Bootstrap jquery vue rect angular.js Node.js
Echars protype ES5 ES6 ajax 等
Mysql oracle redis
Linux centos redhat Nignx
网络协议： Http UDP TCP 等
WebService Websocket
必须要掌握一门应用级语言 Java Python 等
数据结构和算法
二、HTML+CSS+JAVASCRIPT
结构层：html5—XHTML HTML4.0版本 超文本标记语言
表现层：css3.0 -css2.0版本 层叠样式表
行为层：javascript 脚本语言 用于定义整个网站的行为
W3C -----万维网联盟定义一系列的标准 ----Web标准
符合HTTP协议 面向连接 符合Web通信的标准
我们所有的web项目都要尊崇W3C所提供的标准和HTTP协议。
三、超文本标记语言HTML
英文：Hyper Text Markup Language
区分：
HTML ----超文本标记语言---展示数据
XML ---- 可扩展标记语言 ----存储数据 配置文件 json
内容：
HTML ----固定标签 h1 body
XML ---- 没有固定标签 任何标签都可以。 标签---Tag
四、HTML标准格式
使用 ！+Tab 按键 那么就可以自动生成HTML文档模板
<!DOCTYPE html> 文档类型 html ----MIME类型
<html lang="en"> language=“en” zh-cn 属性节点
<head>
<meta charset="UTF-8"> 源 编码字符集----utf-8
<title>Document</title> 标题
</head>
<body>
正文
</body>
</html>五、 基本常用标签
基本标签如下：
<hn>123123123<hn> --标题标签 n=1~6
<p>行</p> --行标签
<br>--换行
<hr>--水平线
六、 a标签
a标签用于定义超链接和锚点
<a>标签常规用法
<a href="https://www.baidu.com">百度一下</a>放入网站网址跳转
<a href="1.html">其他html文件</a>放入html文件路径跳转<a>标签锚点用法
<a href="#ppp">href属性放入另一个a标签的name属性</a>
<a name="ppp">跳转点</a>七、表单
用于收集用户数据 在什么样的场景会使用到表单
登陆、注册 表格 需要提交的场景 都会用表单
必要属性：一个是method定义提交方式，另一个是action定义提交去向
<form action="1.html" method="get">
--文本框
<p>请输入您的用户名：<input type="text" name="username" value="请输入您的用户名"/></p><br>
<p>请输入您的密 码:
<input type="password" name="pwd"/></p>
--单选框
<p>请输入您的性别:
<input type="radio" name="sex" value="男"/>男
<input type="radio" name="sex" value="女"/>女
</p>
--多选框
<p>
请选择您的爱好:
<input type="checkbox" name="hobby" value="吃饭" />吃饭
<input type="checkbox" name="hobby" value="睡觉" />睡觉
<input type="checkbox" name="hobby" value="懒虫"/>懒虫
<input type="checkbox" name="hobby" value="听歌"/>听歌
</p>
--下拉列表
<p>
请选择您的城市:
<select name="city">
<option>--请选择城市--</option>
<option>北京</option>
<option>上海</option>
<option>成都</option>
<option>重庆</option>
<option>广州</option>
</select>
</p>八、列表
列表分为：有序列表，无序列表，自定义列表
1.无序列表
<ul> 无序列表的标签
<li> 列表的选项
<ul>--无序列表
<li>a</li>
<li>b</li>
<li>c</li>
</ul>2.有序列表
<ol> 有序列表标签
<li> 列表的选项
<ol>--有序列表
<li>a</li>
<li>b</li>
<li>c</li>
</ol>3.定义列表
<dl> 表示定义列表
<dt> 定义的项目
<dd> 定义项目的描述
九、img标签
用于在页面中引入图片
src -----source 源代码
alt -----规定图像的替代文本。
border ----边框 单位像素值
width 宽度 height 高度 像素值 ----百分比
usemap 用于做位图 map ----映射
map 位图
area 规定位图区域
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<img src="./image/1.jpg" alt="替代文本" width="10%" height="10%">
</body>
</html>
十、表格
<table> 标签表示的是表格
<tr> 表行
<th> 表头 默认加粗
<td> 表元
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<table border="1px">
<tr>表行
<th>表头</th><th>表头</th><th>表头</th>
</tr>
<tr>
<td>表元</td><td>表元</td><td>表元</td>
</tr>
</table>
</body>
</html>
十一、get与post的区别
在使用表单的时候action属性会用到get和post两种请求方式。get和post有什么不一样吗？
这是get的提交
<form action="" method="GET">
请输入用户名：<input type="text" name="username" id="username" /><br>
请输入密码：<input type="password" name="pwd" id="pwd" /><br>
<input type="submit" value="提交" />
这是post的提交
<form action="" method="POST">
请输入用户名：<input type="text" name="username" id="username" /><br>
请输入密码：<input type="password" name="pwd" id="pwd" /><br>
<input type="submit" value="提交" />
从图片就可以看出，get请求并不安全，用户名与密码都会泄露，所以为了信息安全，一般使用 post 请求。get一般用于安全度不重要的热数据。
除了安全性不同，默认情况下 和 method为get请求，而要使用post就需要手动设置。
get请求在路径的地址上存在属性值 url的地址是有限制的
最大为64kb
3339
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
