lbk60ox 发表于 2024-6-29 19:25:58

HTML基本结构


    <h2 style="color: black; text-align: left; margin-bottom: 10px;">HTML基本结构 </h2>
    <h2 style="color: black; text-align: left; margin-bottom: 10px;">1、导学</h2>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">经过</span>前面课程的学习，<span style="color: black;">咱们</span><span style="color: black;">已然</span><span style="color: black;">认识</span>了关于网页设计中的<span style="color: black;">有些</span><span style="color: black;">平常</span>的概念，<span style="color: black;">那样</span>从这节课<span style="color: black;">起始</span>，<span style="color: black;">咱们</span>就要学习关于HTML的内容。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">在这节课程中，<span style="color: black;">咱们</span>会来学习一下HTML的整体结构，<span style="color: black;">为何</span>要学习整体结构呢？<span style="color: black;">由于</span>，以后编写的每一个网页，</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">它们的整体结构都是<span style="color: black;">同样</span>的，<span style="color: black;">因此</span>说这块内容是非常<span style="color: black;">要紧</span>的。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">学习了整体结构以后，<span style="color: black;">咱们</span>还<span style="color: black;">必须</span><span style="color: black;">认识</span>标签的书写规范，在前面的课程中<span style="color: black;">咱们</span>讲解过,学习HTML,其实<span style="color: black;">便是</span>学习</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML中的标签，<span style="color: black;">那样</span>在书写这些标签的时候，<span style="color: black;">必须</span><span style="color: black;">怎么样</span>的书写规范，<span style="color: black;">或</span>说<span style="color: black;">必须</span><span style="color: black;">重视</span><span style="color: black;">那些</span>问题呢？<span style="color: black;">咱们</span>会在这节</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">课中<span style="color: black;">仔细</span>讲解。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">想要</span>快速的编写HTML代码，<span style="color: black;">加强</span>网页的<span style="color: black;">研发</span>效率，<span style="color: black;">咱们</span>还要学习一款非常牛逼的<span style="color: black;">工具</span>，叫做VSCode. <span style="color: black;">咱们</span>要学</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">习一下<span style="color: black;">怎么样</span><span style="color: black;">经过</span>这款<span style="color: black;">工具</span>来编写网页。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">好了，<span style="color: black;">认识</span>了这节课<span style="color: black;">咱们</span>要讲解的内容以后，下面，<span style="color: black;">咱们</span>看一下这节课的学习目录。</p>
    <h2 style="color: black; text-align: left; margin-bottom: 10px;">2、学习<span style="color: black;">目的</span></h2>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">在这节课中，<span style="color: black;">必须</span>你做到以下几点：</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">第1</span>：能够说出标签的书写规范以及<span style="color: black;">重视</span>事项</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">第二：能够写出HTML骨架标签</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">第三：能够<span style="color: black;">运用</span>VSCode<span style="color: black;">工具</span><span style="color: black;">研发</span>网页</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">第四：能够说出标签语义</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">认识</span>了以上学习目录以后，下面<span style="color: black;">咱们</span>先来学习一下HTML标签书写规范。</p>
    <h2 style="color: black; text-align: left; margin-bottom: 10px;">3、HTML标签语法规范</h2>
    <h3 style="color: black; text-align: left; margin-bottom: 10px;">3.1 网页文件创建</h3>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">在讲解标签的<span style="color: black;">详细</span>语法规范前，<span style="color: black;">咱们</span><span style="color: black;">首要</span>要创建一个网页文件。说到文件，<span style="color: black;">首要</span><span style="color: black;">咱们</span>想到的<span style="color: black;">便是</span>文件都是有类型的，<span style="color: black;">亦</span><span style="color: black;">便是</span>都有扩展名。例如，记事本文件，它的扩展名为 ‘.txt’.</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">那样</span>网页文件的扩展名是什么呢？</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">网页文件的扩展名为:.html <span style="color: black;">或</span>是.htm。<span style="color: black;">因此</span>，你以后看到以.html<span style="color: black;">或</span>是.htm结尾的文件，就<span style="color: black;">晓得</span>这是网页</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">文件，<span style="color: black;">那样</span><span style="color: black;">咱们</span><span style="color: black;">能够</span><span style="color: black;">经过</span>浏览器打开<span style="color: black;">这般</span>的文件，来查看<span style="color: black;">详细</span>的网页内容。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">当然，在创建网页文件的时候，你要<span style="color: black;">重视</span>，<span style="color: black;">不可</span>随意的创建。<span style="color: black;">亦</span><span style="color: black;">便是</span>说，<span style="color: black;">不可</span>随意的在桌面创建一个网页文件，或</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">者是在D盘<span style="color: black;">或</span>C盘创建一个网页文件。<span style="color: black;">为何</span>呢？ 你<span style="color: black;">能够</span><span style="color: black;">思虑</span>一下，<span style="color: black;">咱们</span>一个网站会有<span style="color: black;">非常多</span>的网页文件，<span style="color: black;">倘若</span>你</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">随意创建，<span style="color: black;">那样</span>后期会变得非常难管理。那应该<span style="color: black;">怎么样</span>做呢？<span style="color: black;">咱们</span><span style="color: black;">能够</span>在桌面，<span style="color: black;">或</span>D盘，E盘中，<span style="color: black;">首要</span>创建一文件</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">夹，<span style="color: black;">而后</span>将<span style="color: black;">咱们</span>创建的网页文件都放到这个文件夹中统一的进行管理，<span style="color: black;">这般</span>后期即使是文件<span style="color: black;">尤其</span>多，<span style="color: black;">亦</span>会很容易的</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">进行管理。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">下面，我在我电脑的桌面上新建 一个文件夹，叫做‘MyWeb’.后面创建的网页文件，都放在该文件夹中进行管理。 </p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">当然，这个文件夹的名字，你<span style="color: black;">能够</span><span style="color: black;">按照</span>你的<span style="color: black;">需求</span>自己进行命名。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">创建好文件夹后，进入该文件夹，在这个文件夹中<span style="color: black;">首要</span>创建一个文本文件，<span style="color: black;">亦</span><span style="color: black;">便是</span>扩展名为.txt的文件，文件的名字你<span style="color: black;">能够</span>随意命名，我<span style="color: black;">这儿</span>叫做index.txt.</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">如下图所示：</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic2.zhimg.com/80/v2-3dd8e1b51dc3094e4b5e763e07dff6b5_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">重视</span>：<span style="color: black;">咱们</span>前面讲过，网页文件的扩展名为:.html<span style="color: black;">或</span>是.htm. <span style="color: black;">因此</span>，下面<span style="color: black;">必须</span>对创建的文件改变其类型，<span style="color: black;">最后</span></p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">修改后的结果如下图所示：</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic3.zhimg.com/80/v2-3311683db76bf7f4172a1dbe67cca7fe_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">能够</span>看到，修改完成文件的扩展名后，文件名前面会有</p>




流星的美 发表于 2024-9-4 19:03:23

百度seo优化论坛 http://www.fok120.com/
页: [1]
查看完整版本: HTML基本结构