整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
敬的用户，您是否曾经因为需要给大量的HTML文本添加同样的内容而感到苦恼？让我们介绍一款高效的批量处理工具，为你解决这个问题！这个工具能够快速地给html文本批量添加所需内容，让您不再因苦于手工操作，大幅提升工作效率。
首先，在首助编辑高手的主页面板块栏里，选择“文本批量处理”板块。
第二步，进入板块栏里，我们要点击上方功能栏里的“添加文件”即可
第三步，在弹出来的文件夹里，将您要添加内容的HTML文件进行导入进去
第四步，然后在下方的功能栏里，选择“添加内容”功能即可。
第五步，选择完毕之后，我们就要在下方的内容栏里将要输入的内容进行一一导入进行，即可
第六步，都设置完毕之后，我们就可以点击批量添加内容，等上方的状态栏显示添加成功，我们就可以打开文件进行查看，发现我们的内容已经添加完毕了
最后这些关于html的内容有点查漏补缺的意思了，这一次是关于文本内链接的使用方法，简单来说就是我们的页面中有一个章节名称目录，如何点击目录中的名称，就能正好在页面中显示相应内容。
如图所示：
点击目录的"总体评价"跳转到相应内容，如图：
就是这样的一个效果。在很多网页中经常看到。
这个案例我们会分三部分来讲解。
今天主要学习如何使用<a>标签进行页面内链接，已及从其他网页链接该页面内的指定内容。
这里会有一个问题，就是点击链接后，文字内容会置顶显示，这个默认形式会给我们带来不便，解决方案较复杂，会在最后一次讲解中给出。
下一次我们来学习如何对图片添加映射超链接，映射超链接的意思是，假如我的图片中有两个人物或物象，考虑读者会感兴趣，想了解更多内容，如何框选出物象边缘来添加链接，这就是图像映射超链接。如图：使用一个平时不可见的边框来制作图片映射链接，确保感兴趣的读者能点击到画面中的目标物体。
最后一部分我们将回答今天结尾的问题，也就是如何解决置顶问题。这一部分也会作为HTML部分结束的综合练习，和css部分启蒙的预热练习。，
首先看一下今天的基础代码
<!DOCTYPE HTML>
<html>
<head>
<title>文内链接</title>
</head>
<body >
<a>试飞进程</a>
<a>研制情况</a>
<a>服役动态</a>
<a>总体评价</a>
<p>
<h2><a>试飞进程</a></h2>
歼-20隐形战斗机首架技术验证机于2011年1月11日中午12时50分左右进行首次升空飞行测试，13时08分成功着陆，历时18分钟。<br>整个首飞过程在歼-10S战斗教练机陪伴下完成 。2016年10月28日，首次发布"空军试飞员将驾歼-20飞机亮相中国航展"后，还陆续发布了"歼-20战机列装空军作战部队""空军歼-20战机首次开展海上方向实战化训练"等。
<h2><a>研制情况</a></h2>
在2016年11月1日，第十一届珠海航展，歼-20首次进行空中飞行展示。两架歼-20做了公开飞行，不仅在现场引起轰动，也立刻被西方媒体大量报道。歼-20是中国现代空中力量的代表作，也进入了世界最先进的第五代战斗机行列，它是中国国防能力高速发展的一个象征。<br>2018年11月11日，第十二届中国航展在珠海迎来"高光时刻"：歼-20战机在公开飞行展示中挂弹开仓，震撼献礼人民空军成立69周年纪念日。 <br>2019年10月13日，庆祝人民空军成立70周年航空开放活动新闻发布上，空军新闻发言人申进科大校介绍歼-20战机列阵人民空军"王牌部队"
<h2><a>服役动态</a></h2>
2017年3月9日，中央电视台报道歼-20战斗机正式进入空军序列。<br>2017年3月13日，《中国日报》发布消息称，中国自主研制的歼-20近期将装配国产发动机。<br>2017年7月30日，歼-20三机编队参加在朱日和举行的庆祝中国人民解放军成立90周年阅兵。歼击机梯队飞来，3架歼-20隐形战斗机以楔形编队的形式在天空中飞过。<br>2017年9月28日，在中国国防部行记者会上，国防部新闻发言人吴谦大校介绍歼-20飞机已经列装部队。<br>2017年11月10日上午，中国空军发言人申进科大校表示，歼-20 列装部队后，已经开展编队训练。<br>2018年2月9日，中国空军新闻发言人申进科大校发布消息，歼-20开始列装空军作战部队。<br>2018年10月30日，中国空军4架歼-20隐形战斗机现身珠海金湾机场上空。<br>2019年10月1日，歼-20现身庆祝中华人民共和国成立70周年阅兵式；阅兵中，歼-20与歼-16、歼-10C三型飞机分别以5机楔队组成战斗队形接受检阅；该三款歼击机被誉为中国空军歼击机家族的"三剑客"，是未来联合作战的骨干力量
<h2><a>总体评价</a></h2>
歼-20是眼下亚洲区域最先进的战机，这让中国空军在面对日本、韩国与印度等国家的空军时占有显著优势。外媒将歼-20与其他国家战机进行了对比。俄罗斯苏霍伊苏-57战斗机由于研制进度几度推迟，尚未正式交付入役；美国F-35战斗机也多次出现飞机供氧不足的问题，大面积停飞，出口受阻；韩国KF-X隐形战机先是被爆出因掌握不了关键技术而被迫降成四代半战机的情况，后又传出了合作方印尼打算撤资并已告知韩国的消息。因此，中国歼-20战机成为亚太区域领跑的优势战机。<br>中国空军正向全疆域作战的现代化战略性军种迈进，成为有效塑造态势、管控危机、遏制战争、打赢战争的重要力量。歼-20战机列装空军作战部队，将进一步提升空军综合作战能力，有助于空军更好的肩负起维护国家主权、安全和领土完整的神圣使命。<br>歼20是我国自主研制的第五代战斗机，它的研制实现了既定的四大目标——打造跨代新机、引领技术发展、创新研发体系、建设卓越团队。打造跨代新机，是按照性能、技术和进度要求，研制开发我国自己的新一代隐身战斗机。引领技术发展，指通过自主创新实现强军兴军的目标。歼20在态势感知、信息对抗、协同作战等多方面取得了突破，这是中国航空工业从跟跑到并跑，再到领跑的必由之路。创新研发体系，是指建设最先进的飞机研制条件和研制流程。通过一大批大国重器的研制，我们建立了具有我国特色的数字化研发体系。建设卓越团队，是指通过型号研制，锤炼一支爱党爱国的研制队伍，这些拥有报国情怀、创新精神的优秀青年是航空事业未来发展的生力军。未来，我们将在战斗机的机械化、信息化、智能化发展征程上不断前行。
</p>
</body>
</html>看着复杂，实际上主要都是些内容文字，简化后的代码如下：
<!DOCTYPE HTML>
<html>
<head>
<title>文内链接</title>
</head>
<body >
<a>试飞进程</a>
<a>研制情况</a>
<a>服役动态</a>
<a>总体评价</a>
<p>
<h2><a>试飞进程</a></h2>
歼-20隐形........首次开展海上方向实战化训练"等。
<h2><a>研制情况</a></h2>
在2016年......"王牌部队"
<h2><a>服役动态</a></h2>
2骨干力量
<h2><a>总体评价</a></h2>
歼-20是眼下亚洲区域最先进的战机......不断前行。
</p>
</body>
</html>就是在<body></body>中添加四个<a></a>标签来写入标题，并列写入一个<p></p>标签，并在<p></p>标签中添加文字内容和<h2></h2>标签。这时需要注意的是，<h2></h2>中还要用<a></a>标签夹住标题。
页面效果如下：
下面我们来添加文章内部链接
添加文章内部链接需要一前一后两个<a></a>标签。一个是目录中的<a></a>,如图：
一个是正文中的标题上的<a></a>,如图：
添加内部链接的办法非常简单，首先我们把目录中的标题<a></a>标签称为"召唤者"。把正文中的标题中的<a></a>标签称为"被召唤者"。如果您学过《》这篇教程就会知道，一个标签召唤或调用另一个标签需要能叫出被调用标签的名字！
所以先要给"被召唤者"起名字，起名字的方法有两种，一种是name=""，还有一种是id=""，建议大家都写上，因为有的浏览器不支持name属性。具体写法如下：
<h2><a name="chapter1" id="chapter1">试飞进程</a></h2>在"召唤者"<a>标签中使用href属性来叫出"被召唤者"的名字！示例代码如下：需要在引号中添加#后再写名字。
<!DOCTYPE HTML>
<html>
<head>
<title>文内链接</title>
</head>
<body >
<a href="#chapter1">试飞进程</a><!--看这里-->
<a>研制情况</a>
<a>服役动态</a>
<a>总体评价</a>
</body>
</html><a>标签有点懒，只叫名字的话它会假装听不见，所以还要具体描述它的特征，让它不好意思偷懒，也就是前后两个<a></a>标签中间夹的文字内容要一致，比如上文中的两个<a>中间的内容都是"试飞进程"。如果字不一样，休想叫得动"被召唤者"。
效果如下：
点击后，试飞进程标签跳到了视窗的最顶端，如图：这种顶在视窗顶端的显示的方式我们称之为"置顶"。
下面我们使用这个方法，为剩下的标题添加页面内链接。
打开外部页面中指定信息位置的方法
首先，我们复制一下这个页面文件命名为"打开外部页面文件指定位置.html"，然后删掉<p></p>和其中内容。示例代码如下：
<!DOCTYPE HTML>
<html>
<head>
<title>打开外部页面文件指定位置</title>
</head>
<body >
<a href="#chapter1">试飞进程</a>
<a href="#chapter2">研制情况</a>
<a href="#chapter3">服役动态</a>
<a href="#chapter4">总体评价</a>
</body>
</html>方法非常简单，在href中添加外部页面路径即可！示例代码如下：
<a href="文内链接ceshi.html#chapter1">试飞进程</a>依次添加后，页面效果如下：
点击其中一个标题"研制情况"，页面跳转，如图：
这里，置顶的问题就出现了，如果我们的文章目录一直在视图的顶部，每次点击页面内链接时，顶部的目录就会和标题重叠，非常不美观，解决这个问题就要涉及到<div>布局的应用，我们以后再说。
OK！今天我们的内容结束了，下一次学习图片映射链接功能。
喜欢的朋友请关注我，点赞也会让我动力满满。
HTML序章（学习目的、对象、基本概念）——零基础自学网页制作
HTML是什么？——零基础自学网页制作
第一个HTML页面如何写？——零基础自学网页制作
HTML页面中head标签有啥用？——零基础自学网页制作
初识meta标签与SEO——零基础自学网页制作
HTML中的元素使用方法1——零基础自学网页制作
HTML中的元素使用方法2——零基础自学网页制作
HTML元素中的属性1——零基础自学网页制作
HTML元素中的属性2（路径详解）——零基础自学网页制作
使用HTML添加表格1（基本元素）——零基础自学网页制作
使用HTML添加表格2（表格头部与脚部）——零基础自学网页制作
使用HTML添加表格3（间距与颜色）——零基础自学网页制作
使用HTML添加表格4（行颜色与表格嵌套）——零基础自学网页制作
16进制颜色表示与RGB色彩模型——零基础自学网页制作
HTML中的块级元素与内联元素——零基础自学网页制作
初识HTML中的<div>块元素——零基础自学网页制作
在HTML页面中嵌入其他页面的方法——零基础自学网页制作
封闭在家学网页制作！为页面嵌入PDF文件——零基础自学网页制作
HTML表单元素初识1——零基础自学网页制作
HTML表单元素初识2——零基础自学网页制作
HTML表单3（下拉列表、多行文字输入）——零基础自学网页制作
HTML表单4（form的action、method属性）——零基础自学网页制作
HTML列表制作讲解——零基础自学网页制作
为HTML页面添加视频、音频的方法——零基础自学网页制作
音视频格式转换神器与html视频元素加字幕——零基础自学网页制作
HTML中使用<a>标签实现文本内链接——零基础自学网页制作
题目只能有30个字，不能写全，其实今天我们要学习的内容有三个，第一，下拉列表表单，第二，多行文字输入表单，第三，数据集表单。
开始学习吧！
前天和昨天我们在《HTML表单元素初识1——零基础自学网页制作》和《HTML表单元素初识2——零基础自学网页制作》中基本上把<input/>标签的type属性里不同的值进行了讲解与实践，今天我们来学习其他包含在<form></form>之间的元素。
带有下拉列表的表单
我们在一些网站填写注册信息时，经常会遇到选择"生活所在地"的操作，因为中国的地名是固定的，因此页面会为我们提供一个下拉列表选项，我们直接点选即可，就不需要输入文字了，这样操作的好处在于不会出现拼写错误。例如：
写这个功能我们需要介绍一组新标签<select></select>。"select"（选择）。在这个标签中再添加<option></option>。"option"（选项）。这样就可以写出带有下拉列表的表单了，示例代码如下：
<select><option></option></select>这段代码我们继续在昨天的"表单.html"文件中添加即可，在<input type = "image" src = "img/示例图片/submit.jpg"/><br>这段代码之前即可！与这个图片提交按钮共用一个<form></form>标签！
下面我们为多选表单添加名称，示例代码如下：
请选择省份<select><option></option></select>下面我们添加不同选项，示例代码如下：
请选择省份
<select >
<option >河北</option>
<option >山东</option>
<option >河南</option>
<option >海南</option>
<option >江苏</option>
<option >安徽</option>
</select>
<br><br>为了规范起见，我们为表单信息添加name和value属性，示例代码如下：
请选择省份
<select name = "province">
<option value="Hebei">河北</option>
<option value="Shandong">山东</option>
<option value="Henan">河南</option>
<option value="Hainan">海南</option>
<option value="Jiangsu">江苏</option>
<option value="Anhui">安徽</option>
</select>
<br><br>大家要注意的是，在下拉列表表单中，name写在<select>中，value写在<option>中。
页面效果如下：
这里告诉大家一个规律，下拉列表表单默认显示第一个<option></option>中的文字内容。
如果您想改变这个默认显示，请在需要显示的<option>中添加selected属性，并赋值为"selected"。
示例代码如下：
请选择省份
<select name = "province">
<option value="Hebei">河北</option>
<option value="Shandong">山东</option>
<option value="Henan" selected="selected">河南</option>
<!--选中这个选项--><option value="Hainan">海南</option><option value="Jiangsu">江苏</option><option value="Anhui">安徽</option></select><br><br>页面效果如图：
多行文字输入表单
我们在西瓜视频上发布视频时会被要求填写视频描述，页面中的输入框不是像下图这么短的单行输入框。
而是多行输入框，如图：
使用<textarea></textarea>标签即可添加这样的输入框，不过要设置row（列）和cols（行）属性的数值。示例代码如下：
<br>请简要描述您的剧本的情节<br><textarea row="3" cols="20"></textarea><br>这段代码添加到</select><br><br>之后，与其共同使用一个<form></form>标签。
下面我们为这个多行输入框添加一些提示和限制。
首先，添加提示文字，和type="text"的<input/>标签一样，都是使用placeholder属性。
第二，我们限制一下字数，使用maxlength（最大长度）属性。
第三，在页面加载完成后，直接让光标停留在输入框中，使用autofocus属性。
下面看看如何写吧，示例代码如下：（不要忘记写好name属性！）
<br>
请简要描述您的剧本的情节<br>
<textarea row="3" cols="20" name ="storyOutLine"placeholder="最多输入80字"maxlength="80"autofocus></textarea><br>页面效果如图：
如果刷新页面不能正确显示，请尝试关闭后重新打开！
数据集表单
数据集表单实际上就是一个将不同选项或信息打包上传的设置。
当一组表单元素放到 <fieldset> 标签内时，浏览器会以特殊方式来显示它们，它们可能有特殊的边界、3D 效果，或者甚至可创建一个子表单来处理这些元素。（W3school）
这个数据集有三个部分组成，首先是<fliedset></fliedset>,这个标签不会显示，只是告诉浏览器这里的数据要打包。
第二是<legend></legend>,"legend"(说明)，这里添加数据集名称。
第三就是我们之前学到的那些标签了。
示例代码如下：
<fliedset> <legend>信息打包</legend> </fliedset>下面我们使用这段代码把form2打包一下吧。示例代码如下：
<form>
<fieldset><!--开始-->
<legend>信息打包</legend><br>
<!--标题-->兴趣爱好：<br>
<input type = "checkbox" name = "hobby" value = "reading"/>读书
<input type = "checkbox" name = "hobby" value = "film"/>电影
<input type = "checkbox" name = "hobby" value = "painting"/>绘画
<input type = "checkbox" name = "hobby" value = "music"/>音乐
<br>
最高学历：<br>
<input type = "radio" name = "education" value = "highSchool"/>高中
<input type = "radio" name = "education" value = "bachelor"/>本科
<input type = "radio" name = "education" value = "master"/>硕士
<input type = "radio" name = "education" value = "doctor"/>博士
<br>
请选择省份
<select name = "province">
<option value="Hebei">河北</option>
<option value="Shandong">山东</option>
<option value="Henan" selected="selected">河南</option><!--选中这个选项-->
<option value="Hainan">海南</option>
<option value="Jiangsu">江苏</option>
<option value="Anhui">安徽</option>
</select>
<br><br><br>
请简要描述您的剧本的情节<br>
<textarea row="3" cols="20" name ="storyOutLine"placeholder="最多输入80字"maxlength="80"autofocus></textarea>
<br>
</fieldset><!--结尾-->
<input type = "image" src = "img/示例图片/submit.jpg"/><br>
<input type="reset" /><br>
<input type = "submit" value = "submit"/>
</form>页面效果如下：
今天的内容结束了！
如果您喜欢我的教程请关注我，点赞也能让我充满动力！
HTML序章（学习目的、对象、基本概念）——零基础自学网页制作
HTML是什么？——零基础自学网页制作
第一个HTML页面如何写？——零基础自学网页制作
HTML页面中head标签有啥用？——零基础自学网页制作
初识meta标签与SEO——零基础自学网页制作
HTML中的元素使用方法1——零基础自学网页制作
HTML中的元素使用方法2——零基础自学网页制作
HTML元素中的属性1——零基础自学网页制作
HTML元素中的属性2（路径详解）——零基础自学网页制作
使用HTML添加表格1（基本元素）——零基础自学网页制作
使用HTML添加表格2（表格头部与脚部）——零基础自学网页制作
使用HTML添加表格3（间距与颜色）——零基础自学网页制作
使用HTML添加表格4（行颜色与表格嵌套）——零基础自学网页制作
16进制颜色表示与RGB色彩模型——零基础自学网页制作
HTML中的块级元素与内联元素——零基础自学网页制作
初识HTML中的<div>块元素——零基础自学网页制作
在HTML页面中嵌入其他页面的方法——零基础自学网页制作
封闭在家学网页制作！为页面嵌入PDF文件——零基础自学网页制作
HTML表单元素初识1——零基础自学网页制作
HTML表单元素初识2——零基础自学网页制作
HTML表单3（下拉列表、多行文字输入）——零基础自学网页制作
HTML表单4（form的action、method属性）——零基础自学网页制作
HTML列表制作讲解——零基础自学网页制作
为HTML页面添加视频、音频的方法——零基础自学网页制作
音视频格式转换神器与html视频元素加字幕——零基础自学网页制作
HTML中使用<a>标签实现文本内链接——零基础自学网页制作
*请认真填写需求信息，我们会在24小时内与您取得联系。
