一、html中的标签
上一课利用dreamweaver自动生成的页面的代码为：
“”””像这样方括号里框着英文与符号的玩意就叫做”标签”，又叫标记标签。
Html是由一堆标签组成的超文本标记语言。以上代码一共9个标签。
标签总是成对出现的，其中第一个字符为英文字母的标签叫开始标签，在同样的英文前加了”/”斜杠符号的叫结束标签。
二、html中的元素
开始标签与结束标签的本体与之间的内容叫元素。上节课生成的代码中，“无标题文档”是一个元素，有着开始标签与结束标签，标签之间的”无标题文档”是这个元素的文本。
元素中是可以嵌套其他的元素的。比如上述例子中，””元素中嵌套了”,,,”这四个子元素，””是它们的父元素，因为它们都被包在（嵌套在）””元素中。
三、上述例子中的标签都是什么意思呢？
1.
这个比较特别，不是html的标签。是用来声明文档类型的，必须要放在标签的前面。如果不用声明的话，浏览器会用”怪异模式(quirks mode)”进行渲染。
2.
用来定义文档的开头与结尾，可以理解成之间就是一个网页。
3.
顾名思义，就是网页的头部，可以修改网页的标题、添加css样式表和加载javascript脚本。
4.</strong></p><p>
用来定义网页的标题。</p><p><a href="https://img.111com.net/get_pic/upload/image/20161219202527.png" class="js-smartPhoto" target="_blank"><img src="https://img.111com.net/get_pic/upload/image/20161219202527.png" alt="" /></a></p><p>
网页上的标题就是的内容。</p><p><strong>5.<body></strong></p><p>
网页的主题，网页上用户可视的内容基本都是在这里添加修改。大家想在网页里添加一段文字的话，就得写在里。</p><p><strong>6.<meta></strong></p><p>
这里定义了网页使用UTF-8编码，用在元素里。（标签现在了解就够了）</p><p><span style="color:#E53333;font-size:14px;"><strong>四、如何在自己的网页里加入几段文字呢？</strong></span></p><p>
在这里介绍一个新的标签――<p>标签。</p><p>
<P>是段落标签，每个<P>元素为一个段落，即使<p>元素中出现转行，浏览器中也只会显示出空格。</p><p>
不同的<P>元素之间自动空行。</p><p><strong>举个例子：</strong></p><p><strong>1.中间空了一个字符</strong></p><p><a href="https://img.111com.net/get_pic/upload/image/20161219201510.png" class="js-smartPhoto" target="_blank"><img src="https://img.111com.net/get_pic/upload/image/20161219201510.png" alt="" /></a></p><p><strong>2.第一个后面回车键转行</strong></p><p><a href="https://img.111com.net/get_pic/upload/image/20161219201518.png" class="js-smartPhoto" target="_blank"><img src="https://img.111com.net/get_pic/upload/image/20161219201518.png" alt="" /></a></p><p><strong>3.将“段落”放入新的</strong><strong>标签</strong></p><p><a href="https://img.111com.net/get_pic/upload/image/20161219201526.png" class="js-smartPhoto" target="_blank"><img src="https://img.111com.net/get_pic/upload/image/20161219201526.png" alt="" /></a></p><p>
<p>元素内不管输入多少空格或者转行，显示出来的结果都始终在同一行里；而将想要另起一行的文字标上<p>标签就会实现自动转行。</p><p><span style="font-size:14px;color:#E53333;"><strong>五、试着随便编辑几段文字并预览一下网站的效果吧！</strong></span></p><p>
点击软件右下角的图片上标记的图标可以实时预览网页的效果。</p><p><a href="https://img.111com.net/get_pic/upload/image/20161219201615.png" class="js-smartPhoto" target="_blank"><img src="https://img.111com.net/get_pic/upload/image/20161219201615.png" alt="" /></a></p><p>
以上就是本次教程的内容了，简单介绍了下html里基本的定义和标签，并且能做出有简单文字的网页了。下次教程将教大家几个常用的标签来充实网站的内容！</p>
</div>
</div>
</section>
<div class="wrap-box">
<div class="turnPage wrapStyle">
<a href="https://m.111com.net/art-125553.htm">上一个：<span>从零开始的html教程(1)：html是什么？怎么编辑一个网页呢？</span></a>
<a href="https://m.111com.net/art-125645.htm">下一个：<span>从零开始的html教程(3)：自定义网页的风格、认识属性</span></a>
</div>
</div>
<section class="wrap-box">
<div class="g-tit">
<h2>相关文章</h2>
</div>
<ul class="s-list nobord notop">
<li>
<a href="https://m.111com.net/art-228472.htm" class="s-card">
<div class="s-card-l">
<p class="tit">HTML简单购物数量小程序代码展示</p>
<div class="info">
<span class="person">html5教程</span>
<span class="time">2022-10-31</span>
</div>
</div>
</a>
</li>
<li>
<a href="https://m.111com.net/art-228464.htm" class="s-card">
<div class="s-card-l">
<p class="tit">html canvas实现弹幕功能</p>
<div class="info">
<span class="person">html5教程</span>
<span class="time">2022-10-31</span>
</div>
</div>
<div class="s-card-pic">
<img src="https://assets.111com.net/images/lazy.gif" data-src="https://img.111com.net/m00/7a/2e/958ae89e848fc8c7c37e0cd93d1ddf83_c_246_164.gif" alt="html canvas实现弹幕功能" />
</div>
</a>
</li>
<li>
<a href="https://m.111com.net/art-228463.htm" class="s-card">
<div class="s-card-l">
<p class="tit">HTML中空格表示的意义</p>
<div class="info">
<span class="person">html5教程</span>
<span class="time">2022-10-31</span>
</div>
</div>
</a>
</li>
<li>
<a href="https://m.111com.net/art-228462.htm" class="s-card">
<div class="s-card-l">
<p class="tit">html area标签解读</p>
<div class="info">
<span class="person">html5教程</span>
<span class="time">2022-10-31</span>
</div>
</div>
<div class="s-card-pic">
<img src="https://assets.111com.net/images/lazy.gif" data-src="https://img.111com.net/m00/cb/62/2cb1a4fa41104ed71ef069688f3411a2_c_246_164.png" alt="html area标签解读" />
</div>
</a>
</li>
<li>
<a href="https://m.111com.net/art-228461.htm" class="s-card">
<div class="s-card-l">
<p class="tit">html使用表单标签实现注册页面代码展示</p>
<div class="info">
<span class="person">html5教程</span>
<span class="time">2022-10-31</span>
</div>
</div>
</a>
</li>
<li>
<a href="https://m.111com.net/art-228460.htm" class="s-card">
<div class="s-card-l">
<p class="tit">使用HTML截图并保存为本地图片的代码展示</p>
<div class="info">
<span class="person">html5教程</span>
<span class="time">2022-10-31</span>
</div>
</div>
</a>
</li>
</ul>
</section>
<section class="wrap-box">
<div class="g-tit">
<h2>精彩推荐</h2>
</div>
<ul class="card-box">
<li class="card3">
<a href="https://m.111com.net/azgame/46853.htm" target="_self" class="figure">
<div class="figure-box">
<img src="https://assets.111com.net/images/lazy.gif" data-src="https://img.111com.net/attachment/m_soft/46853/5dcb71bae30a3.png" alt="一剑斩仙" />
</div>
<p class="figure-head">一剑斩仙</p>
<span class="figure-btn">下载</span>
</a>
</li>
<li class="card3">
<a href="https://m.111com.net/azgame/224592.htm" target="_self" class="figure">
<div class="figure-box">
<img src="https://assets.111com.net/images/lazy.gif" data-src="https://img.111com.net/m00/77/b7/b0a10d2c1b09f241dabff441346fb91c.png" alt="超级雷电战机" />
</div>
<p class="figure-head">超级雷电战机</p>
<span class="figure-btn">下载</span>
</a>
</li>
<li class="card3">
<a href="https://m.111com.net/azgame/30153.htm" target="_self" class="figure">
<div class="figure-box">
<img src="https://assets.111com.net/images/lazy.gif" data-src="https://img.111com.net/attachment/m_soft/30153/6d482cbc24.jpg" alt="烈火一刀" />
</div>
<p class="figure-head">烈火一刀</p>
<span class="figure-btn">下载</span>
</a>
</li>
<li class="card3">
<a href="https://m.111com.net/azgame/42147.htm" target="_self" class="figure">
<div class="figure-box">
<img src="https://assets.111com.net/images/lazy.gif" data-src="https://img.111com.net/attachment/m_soft/42147/5d4cf5dfeb6ca.png" alt="天使纪元" />
</div>
<p class="figure-head">天使纪元</p>
<span class="figure-btn">下载</span>
</a>
</li>
</ul>
<ul class="card-box-b">
<li class="card10">
<a href="https://m.111com.net/azgame/127872.htm" target="_self" class="figure2">
<div class="figure-box">
<img src="https://assets.111com.net/images/lazy.gif" data-src="https://img.111com.net/mobile/202111/15/35c0b8587a.png" alt="完美修真" />
</div>
<div class="figure-cont">
<p class="figure-head">完美修真</p>
<div class="figure-desc">
<span>角色扮演</span>
<span>538.52 MB</span>
</div>
<div class="figure-desc">
<p>高清画质体验，华丽场景视觉盛宴</p>
</div>
</div>
<span class="figure-btn">下载</span>
</a>
</li>
<li class="card10">
<a href="https://m.111com.net/azgame/30904.htm" target="_self" class="figure2">
<div class="figure-box">
<img src="https://assets.111com.net/images/lazy.gif" data-src="https://img.111com.net/attachment/m_soft/30904/fd82743d5b.png" alt="永恒领主" />
</div>
<div class="figure-cont">
<p class="figure-head">永恒领主</p>
<div class="figure-desc">
<span>即时网游</span>
<span>392.00 MB</span>
</div>
<div class="figure-desc">
<p>3D魔幻MMO</p>
</div>
</div>
<span class="figure-btn">下载</span>
</a>
</li>
<li class="card10">
<a href="https://m.111com.net/azgame/113807.htm" target="_self" class="figure2">
<div class="figure-box">
<img src="https://assets.111com.net/images/lazy.gif" data-src="https://img.111com.net/mobile/202107/01/275a3dca7e.png" alt="九州八荒录" />
</div>
<div class="figure-cont">
<p class="figure-head">九州八荒录</p>
<div class="figure-desc">
<span>角色扮演</span>
<span>232.56 MB</span>
</div>
<div class="figure-desc">
<p>九州八荒，一剑入魂。</p>
</div>
</div>
<span class="figure-btn">下载</span>
</a>
</li>
<li class="card10">
<a href="https://m.111com.net/azgame/372634.htm" target="_self" class="figure2">
<div class="figure-box">
<img src="https://assets.111com.net/images/lazy.gif" data-src="https://img.111com.net/m00/f5/99/f276753f2f8beb9dd0cceb843afcf723.png" alt="航海王燃烧意志" />
</div>
<div class="figure-cont">
<p class="figure-head">航海王燃烧意志</p>
<div class="figure-desc">
<span>角色扮演</span>
<span>1.57 GB</span>
</div>
<div class="figure-desc">
<p>热血激战动作冒险游戏</p>
</div>
</div>
<span class="figure-btn">下载</span>
</a>
</li>
<li class="card10">
<a href="https://m.111com.net/azgame/37526.htm" target="_self" class="figure2">
<div class="figure-box">
<img src="https://assets.111com.net/images/lazy.gif" data-src="https://img.111com.net/m00/f3/6a/29dc4894964b32d77cad35e9676985d4.png" alt="君临传奇" />
</div>
<div class="figure-cont">
<p class="figure-head">君临传奇</p>
<div class="figure-desc">
<span>角色扮演</span>
<span>43.57 MB</span>
</div>
<div class="figure-desc">
<p>经典RPG战斗手游</p>
</div>
</div>
<span class="figure-btn">下载</span>
</a>
</li>
</ul>
</section>
<footer class="foot">
<a href="https://m.111com.net/" class="logo-icon">
<img src="https://assets.111com.net/mobile/images/logo2.png" alt="一聚教程网">
</a>
<p>Copyright © 2010-2024</p>
<p>111com.net All Rights Reserved</p>
</footer>
<div class="back-top" style="display: block;">
<span class="icon-box"><svg class="icon" viewBox="0 0 1024 1024">
<path
d="M213.333333 640h170.666667v256h256v-256h170.666667l-298.666667-341.333333zM170.666667 128h682.666666v85.333333H170.666667z"
fill="#0374f3">
</path>
</svg>
</span>
</div>
<script src="https://api.111com.net/api/stat/hits?type=article&id=125588"></script>
</div>
<script src="https://assets.111com.net/js/stat.js?v=2024022101"></script>
</body>
</html>
