WEB安全基础-HTML相关知识_web安全跟html有什么关系

作者：菜鸟追梦旅行 | 2024-05-28 11:58:30

踩

web安全跟html有什么关系

HTML相关

JS：为网站添加各式各样的动态功能，为用户提供更流畅美观的动态效果。
CSS：解决内容与表现分离的问题。
HTML：包含网页的实际内容。

HTML源代码


<html>
<head>
<title>第一个网页</title>
</head>
 
<body>
 
<h1>Hello World</h1>
<p>Hello World</p>
</body>
</html>

HTML(Hyper Text Markup Language)
HTML结构和语法

可以用树形结构表示他：
1.<html>为根结点；
2.<head>为<html>子结点；
3.<body>为<html>子结点；

HTML元素
以开始标签起始<p>
以闭合标签终止</p>
闭合标签比开始标签多一个斜杠/
标签中间为元素的内容

属性元素：元素的额外信息；
标签属性：name,id,class,......
事件属性：onload,onerror,onclick,......

注释： 注意：注释标签比较特别，HTML不区分大小写。
图片：<img src="http://XXX.XXX.com/XX/XX/XX.png" width="500" height="100" />
链接：<a href="http://XXX.XXX.com/XXX/XXX.htm">点击访问此网站</a>
表单：
<form>
username:
<input type="text" name="username" />
password:
<input type="passowrd" name="password" />
<input type="submit" value="Submit" />
</form>

内联框架:
<iframe src="http://XXX.XXX.com/XXX/XXX.htm" frameborder="0" width="480" height="240"></iframe>

HTML DOM：
DOM：文档对象模型（DOcument Object Model）将文档转换为树结构；

为什么要把文档转换为树结构：
1.更直观的了解页面元素；
2.通过JavaScript，可以对HTML进行任意操作；

下面是一个练习：

代码如下:


<html>
 
<head>
<title>我的第一个html网站</title>
</head>
 
<body>
<h1>Welcome To Join Us</h1>
<p>Hello World</p>
<!---第一个网站-->
<img src="http://img4.duitang.com/uploads/blog/201402/05/20140205142712_CtJem.jpeg" width="100" height="300" /> <br /><br />
 
 
<a href="http://www.baidu.com">点击访问百度</a><br/><br/>
 
<form>
username:
<input type="text" name="username" />
password
<input type="password" name="password" />
<input type="submit" value="Submit" />
</form><br/><br/>
 
<iframe src="http://www.baidu.com" framborder="0" width="480" height="240"></iframe>
 
</body>
 
</html>

运行结果如下：

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/菜鸟追梦旅行/article/detail/637485