Web安全2.1：前端开发基础（HTML、CSS、JavaScript）

Web安全2.1：前端开发基础（HTML、CSS、JavaScript）

通俗的讲：Web前端指的就是我们用浏览器看到的那部分内容，浏览器展示这些内容，用到了这3个东西：HTML、CSS、JavaScript

1、HTML：

HTML是Hyper Text Markup Language的缩写，超文本标记语言。它是由元素组成，元素也可以叫做标签。
标签的开闭：左边<h1>是开，右边</h1>是闭
除此之外标签是可以嵌套的，比如说头部标题可以当作超链接。
以下标签的关注点都是在能调用网络资源，比如引入站外的文件的标签上等。

有关Web安全的标签	代码
注释（发现敏感信息）	<!-- Hello word -->
设置头部标题	<h1>Hello World！</h1>
设置编码格式为utf-8	<meta charset="utf-8">
超链接	<a href="https://blog.youkuaiyun.com/a1766855068"我的博客></a>
插入图片	<img src="https://xxxx.png">
使用框将网页包含进来	<iframe src="https://blog.youkuaiyun.com/a1766855068"></iframe>
插入本地flash文件	<object data="http://127.0.0.1/1/4.swf" type="application/x-shockwave-flash"></ object>
插入表单	<meta charset="utf-8"> <form action="https://blog.youkuaiyun.com/a1766855068" method="get"> <input type="text" name="name"> <input type="password" name="password"> <input type="submit" value="go"> </form>
插入video	<video width="320" height="240" controls autoplay> <source src="http://127.0.0.1/1/2.webm" type="video/webm"> </video>
插入audio	<audio controls> <source src="http://127.0.0.1/1/3.mp3" type="audio/mp3"> </audio>

2、CSS：

CSS是层叠样式表(Cascading Style Sheets)的缩写，主要是用于 控制页面布局以及一些动画效果 。当我们想要网页上的某个元素显示出我们想要的样式时，可以创建一个.css文件，在里面编写规则，然后用在html内用link标签引入.

css还可以在html标签内的style属性内编写，这样的写法称为行内样式。
但css一般配合选择器使用（选择器作用主要是定位不同的标签，区分出不同标签之前的排版、外观、动画效果）。

代码	效果
<meta charset="utf-8"> <style> .css_test{ color:blue } </style> <h1 style="color:red;">Hello!</h1> <p class="css_test">This is a subtitle!</p>

3、JavaScript：

JavaScript是一个脚本编程语言。JavaScript在浏览器中可以实现很多复杂的功能，比如更换HTML内容，与服务器通讯，甚至是绘制地图，制作3D动画或游戏等。

我们可以通过各种漏洞来执行自己写的JavaScript脚本，来达到控制页面，获取信息等实现自己的一些目的（例如测试XSS漏洞<script>alert(123)<script>可以弹窗。