一个最基本的html文件,必须包含<html>, <head> 和<body> 三个标签 以及<!doctype>声明

1. <!DOCTYPE> 标签

声明必须是 HTML 文档的第一行,位于 <html> 标签之前.

声明的不是 HTML 标签; 它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令.

在 Html5 中只有一种声明形式 <!DOCTYPE html>

2. <html>标签

是用于定义一个html文档, 用于告知浏览器当前文件是html文档, 用以识别.

标签限定了文档的开始点和结束点,在它们之间是文档的头部和主体.

标签中的两个常见属性:

lang属性:

规定元素内容的语言.

xmlns 属性:

可以在文档中定义一个或多个可供选择的命名空间.

该标签支持HTML中的全局属性.

   

3. <head>标签

是所有头部元素的容器, 绝大多数头部标签的内容不会显示给读者

该标签下所包含的部分可加入的标签有 <base>, <link>, <meta>, <script>, <style> 和 <title>

该标签必须包含文档的标题 <title> 标签

   

  • <base>标签

可以为页面中所有链接规定默认地址或目标,

标签两种常见属性:

herf属性:

用以填充 <a>, <img>, <link>, <form> 标签中的相对url中的空白部分,

举例

如设置 <base> 的 herf 属性为 "http://www.leon9dragon.com/img/",

然后设置 <img> 标签中的src属性为 "test.jpg",

最终会让浏览器从 "http://www.leon9dragon.com/img/test.jpg" 这个路径获取图片

target属性:

可以通过设置 target 属性来试得在当前页面打开的链接是在父窗口打开还是新窗口打开等新页面打开情况

举例

target="_blank" 则为在新窗口打开页面, 若等于 "_self" 则覆盖当前窗口打开新页面

    

  • <meta>标签

该标签的目的是为了告诉搜索引擎爬虫, 关于该网站是关于什么内容的,

该标签中的属性与网站搜索索引有关.    

要注意的属性:

content属性:

若要使用 meta 标签, 这个属性是必要属性

定义与 http-equiv 或 name 属性相关的元信息

始终要和 name 属性或 http-equiv 属性一起使用

name属性:

把 content 属性关联到一个名称

提供了名称/值对中的值. 该值可以是任何有效的字符串

name 属性提供了名称/值对中的名称. HTML 和 XHTML 标签都没有指定任何预先定义的 <meta> 名称. 通常情况下, 可以自由使用对自己和源文档的读者来说富有意义的名称。

"keywords" 是一个经常被用到的名称, 为文档定义了一组关键字, 某些搜索引擎在遇到这些关键字时, 会用这些关键字对文档进行分类.

举例

<meta name="keywords" content="HTML,ASP,PHP,SQL">

http-equiv属性:

把 content 属性关联到 HTTP 头部

http-equiv 属性为名称/值对提供了名称. 并指示服务器在发送实际的文档之前先在要传送给浏览器的 MIME 文档头部包含名称/值对.

当服务器向浏览器发送文档时, 会先发送许多名称/值对. 虽然有些服务器会发送许多这种名称/值对, 但是所有服务器都至少要发送一个: content-type:text/html. 这将告诉浏览器准备接受一个 HTML 文档.

举例

<meta http-equiv="charset" content="iso-8859-1">

  • <link>标签

用于链接外部资源, 并定义html文档与外部资源的关系,

最常见用于链接外部文本样式表,

该标签要注意的两个属性:

herf属性:

用以定义文档路径

rel属性:

规定当前文档与被链接文档之间的关系(若不填写该属性, 则不可识别文档作用, 文档就不会被加载)

  • <script>标签

用于插入一段脚本代码, 代码类型通过属性type来定义

也可以通过该标签的src属性来链接外部的脚本文件

  • <style>标签

用于插入一段css样式,

要注意的属性

type属性:

有且只有一种值, 为text/css, 可以不写该属性

注意: 链接外部的css文件只可以通过<link>标签来实现, <style>标签只能用于css代码插入

  • <title>标签

用于定义文档的标题, 这个标题会显示在浏览器的标签上,

可以为空 (内容为空时会调用默认值), 但必须包含在 <head> 当中

4. <body>标签

用于定义文档的主体, 包含了文档的所有内容

该标签支持 html 的全局属性和事件属性.

不建议在 html 标签中用标签自带的某些属性来完成用 CSS 实现的样式

html 标签最好只用于网页结构的布置, 不要用于网页样式的排布修饰

HTML笔记(一) 基础标签的介绍的更多相关文章

  1. 学习笔记—HTML基础标签

    HTML的概念 概念: HTML 是用来描述网页的一种语言. HTML 指的是超文本标记语言 (Hyper Text Markup Language) HTML 不是一种编程语言,而是一种标记语言 ( ...

  2. HTML5学习笔记之表格标签

    HTML5学习笔记之表格标签 其他HTML5相关文章 HTML5学习笔记之HTML5基本介绍 HTML5学习笔记之基础标签 HTML5学习笔记之表格标签 HTML5学习笔记之表单标签 HTML5学习笔 ...

  3. Python学习笔记—Python基础1 介绍、发展史、安装、基本语法

    第一周学习笔记: 一.Python介绍      1.Python的创始人为吉多·范罗苏姆.1989年的圣诞节期间,吉多·范罗苏姆为了在阿姆斯特丹打发时间,决心开发一个新的脚本解释程序,作为ABC语言 ...

  4. 【转】Java基础笔记 – 枚举类型的使用介绍和静态导入--不错

    原文网址:http://www.itzhai.com/java-based-notes-introduction-and-use-of-an-enumeration-type-static-impor ...

  5. Python学习笔记之基础篇(-)python介绍与安装

    Python学习笔记之基础篇(-)初识python Python的理念:崇尚优美.清晰.简单,是一个优秀并广泛使用的语言. python的历史: 1989年,为了打发圣诞节假期,作者Guido开始写P ...

  6. HTML基础标签图片文本超链接列表表格介绍

    1.HTML基础标签图片常见代码形式<img src="图片路径地址" alt="属性名" title="占位符">常见的图片格 ...

  7. HTML+CSS学习笔记(2) - 认识标签(1)

    HTML+CSS学习笔记(2) - 认识标签(1) 1.语义化,让你的网页更好的被搜索引擎理解 标签的用途: 我们学习网页制作时,常常会听到一个词,语义化.那么什么叫做语义化呢,说的通俗点就是:明白每 ...

  8. 从头开始学JavaScript 笔记(一)——基础中的基础

    原文:从头开始学JavaScript 笔记(一)--基础中的基础 概要:javascript的组成. 各个组成部分的作用 . 一.javascript的组成   javascript   ECMASc ...

  9. MyBatis:学习笔记(1)——基础知识

    MyBatis:学习笔记(1)--基础知识 引入MyBatis JDBC编程的问题及解决设想 ☐ 数据库连接使用时创建,不使用时就释放,频繁开启和关闭,造成数据库资源浪费,影响数据库性能. ☐ 使用数 ...

随机推荐

  1. 乱花渐入迷人眼------从解决jqueryEasyUI上传插件提交ajax请求谈网页调试

    由于要给格斗男神写搏击俱乐部ERP系统,就要用到jquery Easyui插件规范数据和表单的录入,其中一项功能就是上传商品图片, 而且是在datagrid-detailview中使用filebox完 ...

  2. Python语法之垃圾回收机制

    目录 一 引入 二.什么是垃圾回收机制? 三.为什么要用垃圾回收机制? 四.垃圾回收机制原理分析 4.1.什么是引用计数? 4.2.引用计数扩展阅读 一 引入 解释器在执行到定义变量的语法时,会申请内 ...

  3. 常见的 DOCTYPE 声明

    HTML 5 <!DOCTYPE html> HTML 4.01 Strict 这个 DTD 包含所有 HTML 元素和属性,但不包括表象或过时的元素(如 font ).框架集是不允许的. ...

  4. 网页“console”输出图文信息

    http://www.monmonkey.com/javascript/jiben2.html 参考以上链接中的转义字符使用. http://www.cnblogs.com/Wayou/p/chrom ...

  5. 【LOJ2316】「NOIP2017」逛公园

    [题目链接] [点击打开链接] [题目概括] 对给定\(K\),起点\(1\)到终点\(n\)中对长度为\([L,L+K]\)的路径计数. \(L\)为\(1\)到\(n\)的最短路长度. [思路要点 ...

  6. ORA-01440:要减小精度和标准,则要修改的列必须为空

    修改字段的精度时,提示“ ORA-01440:要减小精度和标准,则要修改的列必须为空 ” 解决方法:将该表中的数据全部删除即可

  7. [CSP-S模拟测试]:你相信引力吗(单调栈)

    题目传送门(内部题124) 输入格式 第一行一个整数$n$代表环的长度. 第二行$n$个整数表示每个冰锥的高度. 输出格式 一行一个整数表示有多少对冰锥是危险的. 样例 样例输入1: 51 2 4 5 ...

  8. Feature Engineering and Feature Selection

    首先,弄清楚三个相似但是不同的任务: feature extraction and feature engineering: 将原始数据转换为特征,以适合建模. feature transformat ...

  9. C++入门经典-例2.17强制类型转换

    1:代码如下: // 2.17.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include<iostream> using ...

  10. XML文件报错dubbo:XX解决方法

    特别提示:本人博客部分有参考网络其他博客,但均是本人亲手编写过并验证通过.如发现博客有错误,请及时提出以免误导其他人,谢谢!欢迎转载,但记得标明文章出处:http://www.cnblogs.com/ ...