前端学院笔记（一）

最新推荐文章于 2023-09-10 00:07:10 发布

eat_Cookie

最新推荐文章于 2023-09-10 00:07:10 发布

阅读量140

点赞数

分类专栏：前端技术基础个人分享文章标签： html html5

本文链接：https://blog.csdn.net/qq_39088036/article/details/105044147

版权

个人分享同时被 2 个专栏收录

13 篇文章 1 订阅

订阅专栏

前端技术基础

7 篇文章 0 订阅

订阅专栏

一、Web语义化

（1）Web语义化有什么用？

SEO更容易获取到网页，提高网页排名。

（2）Web语义化的形式？

<html>
  <body>
    <article>
      <header>
        <h1>h1 - WEB</h1>
      </header>
      <nav>
        <ul>
          <li>nav1 - HTML语义化</li>
          <li>nav2 - CSS语义化</li>
        </ul>
        </nav>
      <section>
        section1 - HTML语义化
      </section>
      <section>
        section2- CSS语义化
      </section>
      <footer>footer</footer>
      </article>
  </body>
</html>

即多用语义化的标签表示网页

二、简历制作

话不多说，先上自己作的简历，比较简单

<html lang="en">
  <head>
    <meta name="keywords" content="简历">
    <meta name="description" content="简历的第一尝试">
    <title>My resume</title>
      <body>
        <h1>个人简历<h1>
        <h2>基本信息</h2>
        <p>姓名：Gangstar</p>
        <p>性别：男</p>
        <p>出生年月：1990</p>
        <p>籍贯：xxxx</p>
        <p>民族：xx</p>
        <p>就读学校：xx大学</p>
        <p>GPA：3.157/4.0</p>
        <p>移动电话：xxx</p>
        <hr>
        <h2>主要获奖</h2>
          <ul>
        <li>省C++程序设计二等奖</li>
        <li>三好学生</li>
        <li>志愿服务先进个人</li>
        <li>优秀辩手</li>
        <li>优秀学生干部</li>
          </ul>
          <hr>
          <h2>个人专业技能</h2>
          <h3>1.主修课程：</h3>
            <p>专业方向课：xxxxx</p>
            <p>公共基础课：xxxxx</p>
          <h3>2.熟悉软件</h3>
          <ul>
            <li>xxxxx</li>
            <li>xxxx</li>
            <li>xxxx</li>
          </ul>
          <h3>3.证书认证：xxxx</h3>
          <h3>4.课程设计</h3>
          <p>时间 名称 负责内容</p>
          <p>xxxxxx</p>
          <p>xxxxxx</p>
          <p>xxxxxx</p>
          <p>xxxxxx</p>
          <hr>
          <h2>社会实践经历</h2>
          <p>时间      内容</p>
          <p>xxxxxx</p>
          <p>xxxxxx</p>
          <p>xxxxxx</p>
          <p>xxxxxx</p>
          <hr>
          <h2>兴趣爱好：</h2>
          <ol>
            <li>xxxx</li>
            <li>xxx</li>
            <li>xxx</li>
            </ol>
        </body>
    </title>
  </head>
  </html>

三、必须知道的问题

HTML是什么，HTML5是什么
HTML元素标签、属性都是什么概念？

答：不同的标签应用于不同的逻辑场景，来实现不同的页面结构。属性表示这个标签的特性。

文档类型是什么概念，起什么作用？

答：声明HTML的类型，HTML5的开通通常会包含如下代码

<!DOCTYPE HTML>

meta标签都用来做什么的？

答：主要有两个属性需要在之前定义：<meta name="keywords" content="">以及<meta name="description" content="">提升网页搜索的排名，即SEO.

Web语义化是什么，是为了解决什么问题
链接是什么概念，对应什么标签？
常用标签都有哪些，都适合用在什么场景
表单标签都有哪些，对应着什么功能，都有哪些属性
ol, ul, li, dl, dd, dt等这些标签都适合用在什么地方，举个例子

话不多说，直接上实例

<ol>
            <li>xxxx</li>
            <li>xxx</li>
            <li>xxx</li>
</ol>

ol odered list表示有序列表

ul 就表示无序列表

<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>

dl也是定义一个列表

dt是这个列表的标题
dd表示具体内容

eat_Cookie

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
前端学院笔记（一）

一、Web语义化（1）Web语义化有什么用？SEO更容易获取到网页，提高网页排名。（2）Web语义化的形式？<html> <body> <article> <header> <h1>h1 - WEB</h1> </header> &l...
复制链接

扫一扫

专栏目录