前端与 HTML | 青训营笔记

用户4066150300654
469 阅读2分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天 

前端工程师是使用Web技术栈解决多端图形用户界面交互问题的工程师 

前端需要关注的方面：功能 美观 无障碍 安全 性能 兼容 

HTML:HyperText Markup Language 超文本标记语言 超文本：图片，标题，链接，表格等等 

<!doctype html> 标记当前使用的html文件的版本，浏览器根据这个来选择渲染模式，如果没有，浏览器会以老旧的形式渲染

浏览器拿到代码会对代码解析，解析成DOM树

HTML语法

  • 标签和属性不区分大小写，推荐小写
  • 空标签可以不闭合，比如 input、meta
  • 属性值推荐用双引号包裹
  • 某些属性值可以省略，比如 required、readonly

H1~H6标题

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

自定义列表

有序列表<ol><li><li></ol>

无序列表<ul><li><li></ul>

自定义列表

  • 在HTML标签中，<dl>用于标签用于定义描述列表(或定义列表)，该标签会与<dt>( 定义项目/名字)和<dd>( 描述每一个项目/名字)一起使用。

    • <dl></dl> 里面只能包含 <dt> 和 <dd>
    • <dt> 和 <dd>个数没有限制，经常是一个<dt> 对应多个<dd>
<dl>
        <dt>导演：</dt>
        <dd>陈凯歌</dd>
        <dt>主演：</dt>
        <dd>张国荣</dd>
        <dd>张丰毅</dd>
        <dd>巩俐</dd>
        <dt>上映日期：</dt>
        <dd>1993-01-01</dd>
    </dl>

链接

<a></a> target='_blank'新窗口打开

其他

  • 图片img
  • 音频audio
  • 视频video
  • 引用<blockquote> </blockquote>``<cite></cite>
  • 代码code
  • 代码块<pre><code></code></pre>

Day1心得体会：之前已经学习过前端HTML的内容，今天在青训营的录播课程里再次回顾了一下，发现还有一些内容是之前没有接触到的，还是有一些新的知识需要学习，比如浏览器将代码解析成DOM树，引用的标签以及对前端工程师的定义和感悟。果然每天学习都会学到新知识，温故而知新说的就是如此吧，希望寒假能坚持学习。

avatar
文章
阅读
粉丝