【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解

一、HTML概要

【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解

1.1、HTML常见元素

【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
左边是没有设置视口,右边设置了视口,则会按照屏幕大小去加载。
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解

1.2、HTML重要属性

【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
a标签默认在当前窗口打开,如果需要在新的窗口打开可以如下图设置。
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
form属性可以在获取表单内的内容和跟js的一些验证插件结合使用,会很方便。
比如获取form属性内的内容,重置form表单填写的内容等等

1.2.1、获取Html页面框架

打开html页面后点击这个网页链接就可以查看网页的框架。
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
网页链接在下面,直接拖拉到浏览器收藏中即可使用。鼠标左键按住拖动下面红色框中的内容。
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
获取Html页面架构

1.3、HTML版本

【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解

1.4、HTML元素默认样式

css reset
Reset CSS
normalize.css
下面的这个方式,比较简单粗暴。简单在于代码简单,达到的样式效果基本符合我们的要求。粗暴在于,* 会使得页面加载的效率可能不是很好。(但基本不需要考虑这个问题,如果在不想研究这个css reset问题)
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解

1.5、HTML元素分类

按默认样式分:

  1. 块级block:默认情况下会占据整行;
  2. 行内inline(大多为跟文本相关的元素):会和别的元素结合显示;
  3. inline-block(表单元素,下拉元素):对外层表现为inline;对内表现为block;
    按内容分:
    【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解

1.6、HTML元素嵌套关系

  1. 块级元素可以包含行内元素;
  2. 块级元素不一定能包含块级元素;(p不能包含div)
  3. 行内元素一般不能包含块级元素;(a能包含div)

1.7、HTML面试真题

doctype的意义是什么?以标准模式渲染;让浏览器知道元素的合法性;
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解

【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解
【全面系统讲解CSS】学习笔记-第二章 HTML常见元素和理解