【回顾】html简介、基础、元素
1.简介
什么是HTML?
HTML 是用来描述网页的一种语言。
- HTML 指的是超文本标记语言: HyperText Markup Language
- HTML 不是一种编程语言,而是一种标记语言
- 标记语言是一套标记标签 (markup tag)
- HTML 使用标记标签来描述网页
- HTML 文档包含了HTML 标签及文本内容
- HTML文档也叫做 web 页面
HTML 标签
HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
- HTML 标签是由尖括号包围的关键词,比如 <html>
- HTML 标签通常是成对出现的,比如 <b> 和 </b>
- 标签对中的第一个标签是开始标签,第二个标签是结束标签
- 开始和结束标签也被称为开放标签和闭合标签
Web 浏览器
Web浏览器(如谷歌浏览器,Internet Explorer,Firefox,Safari)是用于读取HTML文件,并将其作为网页显示。
只有 <body> 区域 (白色部分) 才会在浏览器中显示。
中文编码
目前在大部分浏览器中,直接输出中文会出现中文乱码的情况,这时候我们就需要在头部将字符声明为 UTF-8。
<!DOCTYPE> 声明
<!DOCTYPE>声明有助于浏览器中正确显示网页。
网络上有很多不同的文件,如果能够正确声明HTML的版本,浏览器就能正确显示网页内容。
实例:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>页面标题</title>
</head>
<body>
<h1>我的第一个标题</h1>
<p>我的第一个段落。</p>
</body>
</html>
2.基础
HTML 标题
HTML 标题(Heading)是通过<h1> - <h6> 标签来定义的.
<h1>这是一个标题</h1>
HTML 段落
HTML 段落是通过标签 <p> 来定义的.
<p>这是一个段落。</p>
HTML 链接
HTML 链接是通过标签 <a> 来定义的.
HTML 图像
(有些版本对大小写可认为相同,而xhtml中强制使用小写)
HTML 图像是通过标签 <img> 来定义的.
3.元素
开始标签 * | 元素内容 | 结束标签 * |
---|---|---|
<p> | 这是一个段落 | </p> |
<a href="default.htm"> | 这是一个链接 | </a> |
<br> | 换行 |
HTML 元素语法
- HTML 元素以开始标签起始
- HTML 元素以结束标签终止
- 元素的内容是开始标签与结束标签之间的内容
- 某些 HTML 元素具有空内容(empty content)
- 空元素在开始标签中进行关闭(以开始标签的结束而结束)
- 大多数 HTML 元素可拥有属性
嵌套的 HTML 元素
HTML 文档由嵌套的 HTML 元素构成。
HTML 文档实例
<html>
<body>
<p>这是第一个段落。</p>
</body>
</html>
以上实例包含了三个 HTML 元素。
不要忘记结束标签
即使您忘记了使用结束标签,大多数浏览器也会正确地显示 HTML:
<p>这是一个段落
以上实例在浏览器中也能正常显示,因为关闭标签是可选的。
但不要依赖这种做法。忘记使用结束标签会产生不可预料的结果或错误。
HTML 空元素
没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。
<br> 就是没有关闭标签的空元素(<br> 标签定义换行)。
在 XHTML、XML 以及未来版本的 HTML 中,所有元素都必须被关闭。
在开始标签中添加斜杠,比如 <br />,是关闭空元素的正确方法,HTML、XHTML 和 XML 都接受这种方式。
即使 <br> 在所有浏览器中都是有效的,但使用 <br /> 其实是更长远的保障。
HTML 提示:使用小写标签
【回顾】html简介、基础、元素的更多相关文章
- Java回顾之Spring基础
第一篇:Java回顾之I/O 第二篇:Java回顾之网络通信 第三篇:Java回顾之多线程 第四篇:Java回顾之多线程同步 第五篇:Java回顾之集合 第六篇:Java回顾之序列化 第七篇:Java ...
- Ansible的基础元素和YAML介绍
本节内容: YAML Ansible常用的数据类型 Ansible基础元素 一.YAML 1. YAML介绍 YAML是一个可读性高的用来表达资料序列的格式.YAML参考了其他多种语言,包括:XML. ...
- ansible入门三(Ansible的基础元素和YAML介绍)
Ansible的基础元素和YAML介绍 本节内容: YAML Ansible常用的数据类型 Ansible基础元素 一.YAML 1. YAML介绍 YAML是一个可读性高的用来表达资料序列的格式 ...
- 『心善渊』Selenium3.0基础 — 4、Selenium基础元素定位详解
目录 1.什么是元素定位 2.Selenium元素定位常用API (1)By_id 定位 (2)by_name 定位 (3)by_class_name 定位 (4)by_tag_name 定位 (5) ...
- Web UI自动化测试基础——元素定位(二)
本篇文章整理了元素定位的基础知识——多个元素定位方式. 一.多个元素定位方式简介 同单个元素定位方式相同,多个元素定位方式也有与之对应的8种方式,即id.name.class_name.tag_nam ...
- Web UI自动化测试基础——元素定位(一)
本篇文章整理了元素定位的基础知识——单个元素定位方式. 一.单个元素定位方式简介 1. find_element_by_id 通过元素的id属性进行定位.以百度首页为例,首先进入https://www ...
- JQuery_DOM 简介/设置元素及内容
一.DOM 简介 1.D 表示的是页面文档Document.O 表示对象,即一组含有独立特性的数据集合.M表示模型,即页面上的元素节点和文本节点. 2.DOM 有三种形式,标准DOM.HTML DOM ...
- Selenium:WebDriver简介及元素定位
参考内容:官方API文档,下载链接:http://download.csdn.net/detail/kwgkwg001/4004500 虫师:<selenium2自动化测试实战-基于python ...
- python 全栈开发,Day32(知识回顾,网络编程基础)
一.知识回顾 正则模块 正则表达式 元字符 : . 匹配除了回车以外的所有字符 \w 数字字母下划线 \d 数字 \n \s \t 回车 空格 和 tab ^ 必须出现在一个正则表达式的最开始,匹配开 ...
- C++ 基础知识回顾(string基础、智能指针、迭代器、容器类)
[1] string基础 [1.1] string 的构造 #include <iostream> #include <string> int main() { using n ...
随机推荐
- Unity3D之Mesh(四)绘制多边形
来自https://www.cnblogs.com/JLZT1223/p/6086191.html 1. 总的来说绘制平面的思想十分简单,就是将需要的平面拆分成几个三角形然后进行绘制就可以啦,主要的思 ...
- 初次认识dedecms和帝国cms内容管理系统
近乎完美的内容模块管理 强大的内容管理系统,细致入微 其原理都是 先建立一个 模板系统 然后动态生成静态页面 注意各个板块和栏目的设置 在迁移网站的时候 尤其需要注意的是 系统参数的 根目录 需要及 ...
- OPENSSL编程 第二十章 椭圆曲线
20.1 ECC介绍 椭圆曲线算法可以看作是定义在特殊集合下数的运算,满足一定的规则.椭圆曲线在如下两个域中定义:Fp域和F2m域. Fp域,素数域,p为素数: F2m域:特征为2的有限域,称之为二 ...
- 【原创】数据库基础之Mysql(3)mysql删除历史binlog
mysql开启binlog后会在/var/lib/mysql下创建binlog文件,如果手工删除,则下次mysql启动会报错: mysqld: File './master-bin.000001' n ...
- 解决KafKa数据存储与顺序一致性保证
“严格的顺序消费”有多么困难 下面就从3个方面来分析一下,对于一个消息中间件来说,”严格的顺序消费”有多么困难,或者说不可能. 发送端 发送端不能异步发送,异步发送在发送失败的情况下,就没办法保证消息 ...
- springmvc框架原理分析和简单入门程序
一.什么是springmvc? 我们知道三层架构的思想,并且如果你知道ssh的话,就会更加透彻的理解这个思想,struts2在web层,spring在中间控制,hibernate在dao层与数据库打交 ...
- vuex——做简单的购物车功能
购物车组件 <template> <div> <h1>vuex-shopCart</h1> <div class="shop-listb ...
- -Dmaven.multiModuleProjectDirectory system property is not set.
1.配置 maven 环境变量 新建系统变量 -> 变量名(N): M2_HOME 变量值(V): D:\apache-maven-3.5.4(改为自己的maven目录) -> 添加 pa ...
- git教程笔记(二)
1.首先进入自己的项目文件 在GitHub上申请一个自己的账户信息.创建一个Repository.然后复制仓库的地址在gitbush中进行clone gitbush中进行远程clone 2.gitbu ...
- Python变量的作用域
局部变量 局部变量是指在函数内部定义并使用的变量,他只在函数内部有效.即函数内部的名字只在函数运行时才会创建,在函数运行之前或者运行完毕之后,所有的名字就都不存在了.所以,如果在函数外部使用函数内部定 ...