谁来教我渗透测试——黑客必须掌握的HTML基础(一)

小伙伴们,好几天不见了,这一周菜鸟小白工作很忙,所以没有每天更新学习内容,但是菜鸟小白的学习是没有停下来的,只是没有时间来整理学习笔记了。现在就将菜鸟小白这两天学习的HTML基础和大家分享,其中还会拿一些标签进行举例,显示效果。

HTML概述

HTML语言是一种标签语言,它不需要编译,可以直接由浏览器执行。在标准网页设计中HTML负责填充网页的内容,HTML编写的超文本文档(文件)称之为HTML文档(网页),它包含了一些html元素,使用html或者htm为文件名后缀,能独立于各种操作系统平台,如Unix、Windows等

HTML文档结构

标准的html文档是由标签和要显示在网页上的内容组成。HTML用于描述功能的符号成为“标签”,如、、

等。HTML标签规定HTML文档的逻辑结构,并且控制文档的显示格式,然后由浏览器来负责解释并显示页面。通过使用标签可以区分文本文件的各个组成部分,对页面上的文字、表格、图片等多媒体数据所出现的未知、形式、顺序及网页间的超链接关系进行设定。

HTML标签

标签都是封装在一对尖括号“<……>”之中。标签只改变网页的显示方式,本身不会显示在窗口中。HTML文档中最先出现的标签是标签。标签是文档标识符,它是成对出现的,首标签和尾标签分别位于文档的最前面和最后面,明确地表示文档是以超文本标识语言(HTML)编写的。该标签不带任何属性

……之间有如下标签:

头部标签……

head是英文“头”的意思。习惯上用户把HTML文档分为文档头和文档主体两部分。文档主体部分就是在web浏览器窗口的用户区内看到的内容,而文档头部分用来规定该文档的标题(出现在web浏览器窗口的标题栏中)和文档的一些属性。标签对的作用就是控制文档的头部信息。中间可以使用……标签对,在此标签中间可以HTML文档的标签是可以嵌套的,即在一对标签中可以嵌入另外一对子标签,用来规定母标签所含范围的属性或其中某一部分内容,嵌套在……标签对中使用的主要有标签</p> <pre><code><html lang="zh-cn"> <head> <meta content="text/html;charset=utf-8"> 菜鸟小白的学习分享 </head> </html> </code></pre> <p>保存为HTML文件后显示如下:</p> <p><a href="http://img.e-com-net.com/image/info8/9e2c69cf497a4f75ab12219e80dfb999.png" target="_blank"><img src="http://img.e-com-net.com/image/info8/9e2c69cf497a4f75ab12219e80dfb999.png" alt="谁来教我渗透测试——黑客必须掌握的HTML基础(一)_第1张图片" width="582" height="130" style="border:1px solid black;"></a></p> <h2><strong>标题标签<title>……

标签是成对出现的,用以规定HTML文档的标题。在<title>……之间的内容将显示在web浏览器窗口的标题栏中。另外,……标签对只能放在……标签对之间,而且其内部不能包含其它标签。




菜鸟小白的学习分享


修改后显示如下:

谁来教我渗透测试——黑客必须掌握的HTML基础(一)_第2张图片

主体标签……

标签也是成对出现的。在……之间的内容将显示在web浏览器窗口的用户区内,它是HTML文档的主体部分。可以把HTML文档的主体区域简单地理解成标题以外的所有部分,该部分可以包含

等标签。结束标签指明主体区域的结尾,在中可以规定整个文档的一些基本属性:

  • “bgcolor”:指定html文档的背景色

  • “text”:指定html文档中文字的颜色

  • “link”:指定html文档中待连接超链接对象的颜色

  • “alink”:指定html文档中连接中超链接对象的颜色

  • “vlink”:指定html文档中已连接超链接对象的颜色

  • “background”:指定html文档的背景文件

我们验证了前两个属性




菜鸟小白的学习分享

​

  测试内容
​


显示效果如下:

谁来教我渗透测试——黑客必须掌握的HTML基础(一)_第3张图片

特殊字符

在html中有许多特殊字符需要处理,例如:“<”、">"这两个符号本身是用来表示标签的开始和结束的,是没有办法通过直接打出来的,必须输入编码表示法:“<”和“>”。

通常情况下html会自动截取多余的空格。不管你加多少个空格,都被看做一个空格。如果要显示多个空格,可以使用 表示空格

我们看看实现代码




菜鸟小白的学习分享

​

  <测试内容>  空格在中间 看到了吧
​


显示效果:

谁来教我渗透测试——黑客必须掌握的HTML基础(一)_第4张图片

格式标签

在浏览器中控制文本对象的显示,包括段落、换行、水平线等标签,下面介绍几个常用的html格式标签。所有的格式标签全部都是在嵌套在……标签对之间的

段落标签

全称paragraph。

……

标签对用于创建一个段落,支持align属性来设置对齐方式,语法如下:

  • 段落内容

  • align:设定水平对齐方式,常见设置:

  • 置左:align=“left”

  • 置中:align=“center”

  • 置右:align=“right”

    我们验证一个居中的对齐方式吧




菜鸟小白的学习分享

<测试内容> 空格在中间 看到了吧

显示效果:

谁来教我渗透测试——黑客必须掌握的HTML基础(一)_第5张图片

换行标签

在不另起一段的情况下将当前文本强制换行,
标签属于单独出现的标签,禁止出现结束标签。




菜鸟小白的学习分享

<测试内容>
空格在中间 看到了吧

显示效果:

谁来教我渗透测试——黑客必须掌握的HTML基础(一)_第6张图片

预格式化标签

可以完整保留设计者在源文件中所定义的格式,包含各种空格,缩进,以及其他特殊字符,全部都原封不动的展示在浏览器页面上。




菜鸟小白的学习分享

<测试内容>
空格在中间 看到了吧

我是菜鸟小白
你们的好朋友
​
  让我们一起学习吧!!!

显示效果:

谁来教我渗透测试——黑客必须掌握的HTML基础(一)_第7张图片

列表标签

主要分为无序列表、排序列表、目录列表、菜单列表和描述性列表五中类型

  • 无序列表

    • ……

  • 排序列表

    1. ……

  • 目录列表

  • 菜单列表

  • 描述性列表

    列表头
    列表内容

    ​我们就验证一个无序列表和一个描述性列表吧

    ​无序列表:




菜鸟小白的学习分享
  • 我是菜鸟小白
  • 你们的好朋友
  • 让我们一起学习吧!!!

效果如下:

谁来教我渗透测试——黑客必须掌握的HTML基础(一)_第8张图片

描述性列表:




菜鸟小白的学习分享
菜鸟小白测试表头
我是菜鸟小白
你们的好朋友
让我们一起学习吧!!!
菜鸟小白测试表头2
我是菜鸟小白
你们的好朋友
让我们一起学习吧!!!

显示效果如下:

谁来教我渗透测试——黑客必须掌握的HTML基础(一)_第9张图片

image

好了,今天的内容就到这了,我们明天继续学习HTML基础内容,不见不散~

你可能感兴趣的:(笔记)