一.概念

文本   用于储存和记录文字信息的载体

html  超文本标记语言(本质就是给文本增加语义 如<h1></h1>就是给文字添加一级标题的语义)

注:互联网三大基石 有

html 标记数据

http 定义数据怎么传输 传输协议

url 数据地址 http://ip地址:端口号/资源路径

二.版本

html 5

html 4.01

三.语法

  • HTML 标签是由尖括号包围的关键词,比如 <html>
  • HTML 标签通常是成对出现的,比如 <b> 和 </b>
  • 标签对中的第一个标签是开始标签,第二个标签是结束标签
  • 开始和结束标签也被称为开放标签闭合标签

注意:Web 浏览器的作用是读取 HTML 文档,并以网页的形式显示出它们。浏览器不会显示 HTML 标签,而是使用标签来解释页面的内容

四. HTML文档结构

<!DOCTYPE>

<html>

<head></head>

<body></body>

</html>

1.<!DOCTYPE> 声明

<!DOCTYPE>声明有助于浏览器中正确显示网页。

网络上有很多不同的文件,如果能够正确声明HTML的版本,浏览器就能正确显示网页内容。

H5 声明:<!DOCTYPE html>

H4声明  :<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd">

XH声明  :<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

2.<html></html>

标签告知浏览器这是一个 HTML 文档。

属性:manifest:   url  在此url上定义该文档的缓存信息

   xmlns    :http://www.w3.org/1999/xhtml

        规定 XML 的 namespace(属性命名空间) 属性(如果您需要您的内容符合 XHTML,则使用这个属性。)

      注意:该属性在xhtml中必须,在html中可要可不要

五. <head>标签结构

<title> 标签定义文档的标题,在所有 HTML 文档中是必需的。

<style> 标签定义 HTML 文档的样式信息。每个 HTML 文档能包含多个 <style> 标签。

  <base>标签为页面上的所有的相对链接规定默认 URL 或默认目标。在一个文档中,最多能使用一个 <base> 元素。<base> 标签必须      位于 <head> 元素内部。

      请把 <base> 标签排在 <head> 元素中第一个元素的位置,这样 head 区域中其他元素就可以使用 <base> 元素中的信息了。

      注释:如果使用了 <base> 标签,则必须具备 href 属性或者 target 属性或者两个属性都具备。

<link>标签定义文档与外部资源的关系。最常见的用途是链接样式表。

<meta>元数据(Metadata)是数据的数据信息。

<script>标签用于定义客户端脚本,比如 JavaScript。

元素既可包含脚本语句,也可以通过 "src" 属性指向外部脚本文件。

JavaScript 通常用于图像操作、表单验证以及动态内容更改。

      如果使用 "src" 属性,则 <script> 元素必须是空的。

<noscript>元素用来定义在脚本未被执行时的替代内容(文本)。此标签可被用于可识别 <noscript> 标签但无法支持其中的脚本的浏览器。

1.<meta>

<meta charset="UTF-8"> 定义该文档的编码格式

<meta name="description" content="免费在线教程">  定义web页面描述

<meta name="keywords" content="HTML,CSS,XML,JavaScript">  定义文档关键词,用于搜索引擎

<meta name="author" content="runoob">  定义页面作者:

<meta http-equiv="refresh" content="30 http://www.baidu.com">进入该网页后 30秒刷新 刷新地址为http://www.baidu.com

<meta http-equiv="refresh" content="30 http://www.baidu.com">进入该网页后 30秒原地刷新

2.<style>(如需链接外部样式表,请使用 <link> 标签)

  属性   media 表规定不同的媒体类型。

       scoped 如果使用该属性,则样式仅仅应用到 style 元素的父元素及其子元素。

3. base

属性    href   规定页面中所有相对链接的基准 URL。

        target  规定页面中所有的超链接和表单在何处打开。该属性会被每个链接中的 target 属性覆盖。

        _blank  在新窗口中打开被链接文档。

        _parent  在父框架集中打开被链接文档。

        _self  默认。在相同的框架中打开被链接文档。

        _top   在整个窗口中打开被链接文档。

        framename 在指定的框架中打开被链接文档。

4.<link>  标签定义文档与外部资源的关系。  

href  定义被链接文档的位置。

hreflang 定义被链接文档中文本的语言。

media 规定被链接文档将显示在什么设备上。

rel 必需。定义当前文档与被链接文档之间的关系。

  stylesheet 要导入的样式表的 URL。

  5.<script>

标签用于定义客户端脚本,比如 JavaScript。

元素既可包含脚本语句,也可以通过 "src" 属性指向外部脚本文件。

属性 :

async :规定异步执行脚本(仅适用于外部脚本)。

charset:规定在脚本中使用的字符编码(仅适用于外部脚本)。

defer :规定当页面已完成解析后,执行脚本(仅适用于外部脚本)。

src:规定外部脚本的 URL。

type:规定脚本的 MIME 类型。

如果 async="async":脚本相对于页面的其余部分异步地执行(当页面继续进行解析时,脚本将被执行)

如果不使用 async 且 defer="defer":脚本将在页面完成解析时执行

如果既不使用 async 也不使用 defer:在浏览器继续解析页面之前,立即读取并执行脚本

六 . <body>内的常用标签

<h1> - <h6>  标签被用来定义 HTML 标题。

<hr>  标签定义 HTML 页面中的主题变化(比如话题的转移),并显示为一条水平线。

属性: align  :left center right  (h5不支持)

   noshade :  规定 <hr> 元素的颜色呈现为纯色。

        noshade  (h5不支持)

   size   : 规定 <hr> 元素的高度.

   width:规定 <hr> 元素的宽度。

  <i> 定义与文本中其余部分不同的部分,并把这部分文本呈现为斜体文本。

    其他语义

<em> (被强调的文本)

<strong> (重要的文本)

<mark> (被标记的/高亮显示的文本)

<cite> (作品的标题)

<dfn> (一个定义项目)

  <sub> 下标

  <sup> 上标

  <pre> 显示文本原本格式

  <img> 标签定义 HTML 页面中的图像。

    属性: alt :图片的替代文本

       height :图长

       width :图宽

       src :图片的地址

table标签结构

<table>

<caption></caption>

<colgroup>

<col>

</colgroup>

<thead>

<tr><th></th></tr>

<thead>

<tbody>

<tr><td colspan>列合并</td><td rowspan>行合并</td></tr>

</tbody>

<tfoot>

  <tr><td></td></tr>

</tfoot>

</table>

    

2019-4-25 html学习笔记的更多相关文章

  1. Linux(10.18-10.25)学习笔记

    一.学习目标 1. 了解常见的存储技术(RAM.ROM.磁盘.固态硬盘等) 2. 理解局部性原理 3. 理解缓存思想 4. 理解局部性原理和缓存思想在存储层次结构中的应用 5. 高速缓存的原理和应用 ...

  2. Jerry Wang从2017年到2019年的自由泳学习笔记

    打腿 把注意力调整到脚部,尽量不要让他打出水面,因为在空气中大腿完全是无用功,但是如果只是脚跟出水一点,倒也没什么关心,但是主观上,要控制一下,如果你听到你的打腿是"咚咚咚咚"这样 ...

  3. 2019/1/10 redis学习笔记(二)

    本文不涉及集群搭建操作 关于在lua脚本中操作redis的应用场景 大家都知道redis对于单个集合的操作是原子性的;但是有可能有一种场景是这样.比如说抢红包,现在有十个人抢五份红包,抽象到我们jav ...

  4. [2019.05.09]Linux 学习笔记(3)

    最近的心得: CLI真好用,GUI就是渣渣 1. Bash 里面的命令是可以起别名的,起一个别名的方法是 alias [Alias]=[command] command可以是任意长的别名,比如 ali ...

  5. MongoDB学习笔记系列

    回到占占推荐博客索引 该来的总会来的,Ef,Redis,MVC甚至Sqlserver都有了自己的系列,MongoDB没有理由不去整理一下,这个系列都是平时在项目开发时总结出来的,希望可以为各位一些帮助 ...

  6. MongoDB学习笔记系列~目录

    MongoDB学习笔记~环境搭建 (2015-03-30 10:34) MongoDB学习笔记~MongoDBRepository仓储的实现 (2015-04-08 12:00) MongoDB学习笔 ...

  7. Tensorflow学习笔记2019.01.22

    tensorflow学习笔记2 edit by Strangewx 2019.01.04 4.1 机器学习基础 4.1.1 一般结构: 初始化模型参数:通常随机赋值,简单模型赋值0 训练数据:一般打乱 ...

  8. 2019国家集训队论文《整点计数》命题报告 学习笔记/Min25

    \(2019\)国家集训队论文<整点计数>命题报告 学习笔记/\(Min25\) 补了个大坑 看了看提交记录,发现\(hz\)的\(xdm\)早过了... 前置知识,\(HAOI\)< ...

  9. IOS学习笔记25—HTTP操作之ASIHTTPRequest

    IOS学习笔记25—HTTP操作之ASIHTTPRequest 分类: iOS2012-08-12 10:04 7734人阅读 评论(3) 收藏 举报 iosios5网络wrapper框架新浪微博 A ...

  10. Tensorflow学习笔记2019.01.03

    tensorflow学习笔记: 3.2 Tensorflow中定义数据流图 张量知识矩阵的一个超集. 超集:如果一个集合S2中的每一个元素都在集合S1中,且集合S1中可能包含S2中没有的元素,则集合S ...

随机推荐

  1. oracle instantclient + plsql 远程连接数据库

    PLSQL Developer连接数据库:   1.不连接数据库登陆PLSQL Developer(登陆界面按“取消”即可).在Tools->Perferences->Connection ...

  2. centos部署redis主从

    安装环境 CentOS 6.5 .CentOS 7.4 主Redis:10.159.44.175 从Redis: 10.159.44.176.10.159.44.177 Redis下载和安装 在3台机 ...

  3. 使用Pyquery+selenium抓取淘宝商品信息

    配置文件,配置好数据库名称,表名称,要搜索的产品类目,要爬取的页数 MONGO_URL = 'localhost' MONGO_DB = 'taobao' MONGO_TABLE = 'phone' ...

  4. 281. Zigzag Iterator z字型遍历

    [抄题]: Given two 1d vectors, implement an iterator to return their elements alternately. Example: Inp ...

  5. swift 设置阴影和圆角

    1.正常view设置阴影 func setShadow(view:UIView,sColor:UIColor,offset:CGSize, opacity:Float,radius:CGFloat) ...

  6. java项目中VO和DTO以及Entity,各自是在什么情况下应用

    1.entity里的每一个字段,与数据库相对应, 2.dto里的每一个字段,是和你前台页面相对应, 3.VO,这是用来转换从entity到dto,或者从dto到entity的中间的东西.   举个例子 ...

  7. VMWare 14.1 15 Pro 安装 macOS Mojave 10.14.1系统 遇到的问题解决方案

    安装环境 WIN10VMware Workstation Pro 15.0.0 Build 10134415工具准备1.VMware Workstation Pro 15.0.0 Build 1013 ...

  8. hp visual user generator

    loadrunder  自动化测试 脚本 用例

  9. [SoapUI] 从测试套件,测试用例,测试步骤,测试数据各个级别控制是否执行

    自动保存 # -*- coding: utf-8 -*- import java.awt.Color import org.apache.poi.ss.usermodel.Cell import or ...

  10. PowerShell 脚本中调用密文密码

    1. 把密码转变为加密的字符串.使用命令 ConvertFrom-SecureString Read-Host "Enter Password" -AsSecureString | ...