HTML是web前端开发的基础，学习前端的人都是先从html学起的。

关于HTML有一些必备的知识点，这些知识点都是HTML中最基本的内容，也是前端面试最常问的知识点。

1、网页结构
网页结构一般都包含文档声明DOCTYPE，并且在head中的meta应该包含编码格式、关键字、网页描述信息。简单格式如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">

<meta name="description" content="。。。。。。">
<meta name="Keywords" content="。。。。。。">
<title>Hello World</title>
</head>
<body>
</body>

</html>

2、自关闭元素
<br>、<embed> 、<hr>、<img>、<input>、<link>、<meta>、<param>、<source>、<wbr>
自关闭元素不需要使用结束标签。

3、布局最常用的两个元素
（1）div：流布局使用；
（2）span：文字块使用。

4、块级别元素和行级别元素
块级别元素：是指开始在新的行，占领整行宽度。例如div默认是块级别block元素；
行级别元素：仅仅维持内容的宽度，例如文字块的span元素；
通过CSS的display属性声明元素显示级别，一般包括inline行级别、inline-block行内块元素、block、table块级别表格。

5、文字类元素
（1）加粗元素：strong、b。例如：
<p><strong>Caution:</strong> Falling rocks.</p><p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>
（2）倾斜元素：和。例如：
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>
<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

6、HTML5新增的结构化元素
（1）结构化元素包括：<header>, <nav>, <article>, <section>, <aside>, <footer>。
（2）元素级别：都是block级别元素，不包含样式，只用于结构化，每个页面可多次使用。
（3）元素说明：header描述头部信息，nav用于导航模块，article用于可重新覆盖的新闻类内容块，section模块化，aside页面左或右模块，footer底脚模块。

7、页面内跳转
如果需要跳转到页面指定的位置，可在该位置设置元素的id属性，然后为链接添加href="#id"。例如：
<body id="top">
...
<a href="#top">Back to top</a>
...
</body>

html 7大知识点的更多相关文章

  1. 我在阿里这仨月 前端开发流程 前端进阶的思考 延伸学习的方式很简单：google 一个关键词你能看到十几篇优秀的博文，再这些博文中寻找新的关键字，直到整个大知识点得到突破

    我在阿里这仨月 Alibaba 试用期是三个月,转眼三个月过去了,也到了转正述职的时间.回想这三个月做过的事情,很多很杂,但还是有重点. 本文谈一谈工作中遇到的各种场景,需要用到的一些前端知识,以及我 ...

  2. 学习JavaScript你必须掌握的8大知识点！

    大知识点! 一.JavaScript思维导图之<变量>的学习 二.    JavaScript思维导图之<函数基础>  三.JavaScript思维导图之<基本dom操作 ...

  3. gradle的安装，配置，构建，研究，初体验......（入职一周研究的第一个大知识点）

    (1)Gradle是一个基于Apache Ant和Apache Maven概念的项目自动化构建工具.它使用一种基于Groovy的特定领域语言(DSL)来声明项目设置,抛弃了基于XML的各种繁琐配置.更 ...

  4. 学Java分布式和高架构，必懂的两大知识点！

    今天小编为你们分享阿里巴巴2018年招聘应届毕业生,Java工程师的面试考题,主要分为三种 Java中获取 mysql连接的方式: 第一部分:分布式   三步变成:分布式 1.将你的整个软件视为一个系 ...

  5. 10分钟详解Spring全家桶7大知识点

    Spring框架自2002年诞生以来一直备受开发者青睐,它包括SpringMVC.SpringBoot.Spring Cloud.Spring Cloud Dataflow等解决方案.有人亲切的称之为 ...

  6. JavaScript你必须掌握的8大知识点

    一:JavaScript思维导图之<基本dom操作> 二.JavaScript思维导图之<变量>的学习 三.  JavaScript思维导图之<函数基础>  四.J ...

  7. Javascript知识点记录（二）

    Javascript入门易,精通难,基本上是共识的一个观点.在这个篇幅里,主要对一些难点进行记录. 鸭子类型 Javascript属于动态类型语言的一种.对变量类型的宽容,给了很大的灵活性.由于无需类 ...

  8. FPGA知识大梳理（一）对FPGA行业的一点感言

    今天想开始把这FPGA行业的知识点做一个大整理,从个人感想,到语法,到器件基础,难点攻克,到项目应用.把自己这几年接触到的知识做一个全面的回顾,看看自己这几年走过的路. 人生无常,几年的跌跌撞撞勉强算 ...

  9. BZOJ:4530: [Bjoi2014]大融合

    4530: [Bjoi2014]大融合 拿这题作为lct子树查询的练手.本来以为这会是一个大知识点,结果好像只是一个小技巧? 多维护一个虚边连接着的子树大小即可. #include<cstdio ...

随机推荐

  1. JS笔记 入门第四

    小测试: 注意:取消所有的设定可以直接使用 document.getElementById("txt").removeAttribute("style"); 这 ...

  2. jdk outMemory内存溢出

    参数的含义: -vmargs -Xms256M -Xmx768M -Xss256k -XX:PermSize=256M -XX:MaxPermSize=768M -vmargs 说明后面是vm的参数 ...

  3. Qt中如果通过QStyle自定义能够跨平台的界面控件

    我们经常会碰到需要定制界面控件的要求.如果只是在一个平台上,比如说你的控件只需要在Windows上显示,那很好办,Hard code 你的look and feel就可以了.但是如果界面需要在不同平台 ...

  4. Android快速开发框架——AndroidAnnotations(Code Diet)

    简介:AndroidAnnotations是一个依赖注入方式来简化代码结构 ,快速开发的开源框架,使结构代码更清晰,减少代码重复性.对今后我们做自动化测试和自动化埋点开发都会提高开发效率.跟我们之前使 ...

  5. file_get_contents 超时设置

    <?php $ctx = stream_context_create( array( 'http' => array( 'timeout' => 1 //设置一个超时时间,单位为秒 ...

  6. easyui-layout中的收缩层无法显示标题问题解决

    先看问题描述效果图片: 如上,我的查询条件是放在layout下面的一个可收缩层中,初始是收缩的,title显示不出来的话对使用者很不方便,代码如下: <div id="__MODULE ...

  7. Azure 网站和通配符域

     本文章由Azure 网站团队软件开发工程师Michael Candido 撰写 一些 Web 应用程序需要使用多个子域,在某些情况下还需要动态添加新的子域.例如,一个多租户 Web 应用程序可使 ...

  8. HDU 5735 Born Slippy（拆值DP+位运算）

    [题目链接] http://acm.hdu.edu.cn/showproblem.php?pid=5735 [题目大意] 给出一棵树,树上每个节点都有一个权值w,w不超过216,树的根为1,从一个点往 ...

  9. Javascript Duff装置 循环展开(Javascript Loop unrolling Duff device)

    Javascript 中会用到for 循环,当要循环的数据记录很多的时候,可能会对性能产生很大影响.这时我们可以考虑展开for循环,这时就要用到Duff装置(Duff Device). 先来看一个小例 ...

  10. video标签 拖动 转自w3school

    调整视频大小 播放 暂停 用js实现 详细参见http://www.w3school.com.cn/tiy/t.asp?f=html5_video_dom 图片的拖动详见http://www.w3sc ...