html笔记1 | 青训营笔记

112 阅读1分钟
theme: github

这是我参与「第四届青训营 」笔记创作活动的第一天

简单记录一下HTML的一些知识

h1~h6,标题标签

h1定义最大的标题,h2定义最小的标题 p是段落前后换行 br是换新行

<h1>字体排印学</h1>
<h2>历史</h2>
<p>活字的雏形或可追溯至公元前两千年前后美索不达米亚文明的乌鲁克和拉尔萨,砖块上面不均匀的印花被视作有可能是活字思想雏形。</p>
<h3>印刷体源流</h3>
<p>中国在唐代就已经出现雕版印刷术,公元868年的《金刚经》是现存最古老的印刷品之一,使用的技术即是木雕版印刷。</P>
<h2>应用</h2>
<p>...</p>
<br>...</br>

dl,ol,ul有序列表,无序列表,自定义列表

有序列表始于 < ol> 标签。每个列表项始于 < li> 标签 无序列表使用 < ul> 标签 自定义列表以 < dl> 标签开始。每个自定义列表项以 < dt> 开始。每个自定义列表项的定义以 < dd> 开始

<h2>世界电影票房排行榜</h2>
        <ol>
          <li>阿凡达</li>
          <li>泰坦尼克号</li>
          <li>复仇者联盟</li>
        </ol>
        
        <h2>菜单</h2>
        <ul>
          <li>Coffee</li>
          <li>Milk</li>
          <li>Tea</li>
        </ul>
        
        <h2>霸王别姬</h2>
        <dl>
          <dt>导演:</dt>
          <dd>陈凯歌</dd>
          <dt>主演:</dt>
          <dd>张国荣</dd>
          <dd>张丰毅</dd>
          <dd>巩俐</dd>
          <dt>上映日期:</dt>
          <dd>1993-01-01</dd>
        </dl>

链接标签

HTML使用标签 < a>来设置超文本链接。 HTML 链接语法:<a href="url">链接文本</a>

<a href="https://www.bytedance.com/">
            字节跳动官网
          </a>
          <!--使用 target 属性,你可以定义被链接的文档在何处显示。-->
          <!--下面的这行会在新窗口打开文档。-->
          <a href="https://www.bytedance.com/" target="_blank">
            字节跳动官网
          </a>

图像

图像的语法是: <img src="url" alt="some_text"> alt 属性用来为图像定义一串预备的可替换的文本

<img
        src="https://lf3-static.bytednsdoc.com/obj/eden-cn/ubqnuhbnuho/movable_type.jpg"
        alt="Metal movable type"
        height="300"
        width="400"
        />

音频与视频

<audio 
        src="/assets/music.ogg"
        controls
      ></audio>
      
      <video
        src="/assets/video.mp4"
        controls
      ></video>

\