HTML5--笔记--1

我不是女神ヾ 2023-01-05 05:30 192阅读 0赞

HTML5–笔记

1.  网页  
    1.2 什么是HTML

HTML指的是 超文本标记语言(Hyper Text Markup Language), 它是用来描述网页的一种语言,GTML不是一种编程语言,而是一种标记语言(markup language).  
标记语言是一套标记标签(markup tag).

所谓 超文本, 有两层含义:  
1. 它可以加入图片/声音/动画/多媒体等内容(超越了文本限制).  
2. 它还可以从一个文件跳转到另一个文件,与世界各地主机的文件连接(超级链接文本)

1.  常用浏览器  
    浏览器内核(渲染引擎): 负责读取网页内容,整理讯息,计算网页的显示方式并显示网页
    
    浏览器内核 内核  
    IE Trident  
    firefox Gecko  
    Safari Webkit  
    chrome Blink

目前国内一般浏览器都会采用Webkit/Blink内核,如360,UC,QQ等

1.  Web标准(重点)  
    Web标准是由W3C组织和其他标准化组织制定的一系列标准的集合,W3C(万维网联盟)是国际最著名的标准化组织

3.1 为什么需要Web标准  
遵循Web标准除了可以让不同的开发人员写出的也米娜更标准,更统一外,还有以下优点:  
1. 让Web的发展前景更广阔  
2. 内容能给被广泛的设备访问  
3. 更容易被搜索引擎搜索  
4. 降低网站流量费用  
5. 使网站更易于维护  
6. 提高页面浏览速度

3.2 Web标准的构成  
主要包括结构(Structure)/表现(Presentation)和行为(Behavior)三个方面

标准 说明  
结构 结构用于对网页元素进行整理和分类,现阶段主要学的是HTML  
表现 表现用于设置网页元素的板式,颜色,大小等外观羊水,主要指的是CSS  
行为 行为是指网页模型的定义及交互的编写,现阶段主要学的是JavaScript

Web标准提出的最佳解决方案:结构,样式,行为相分离  
简单理解:结构写到HTML文件中,表现写到CSS文件中,行为写到JavaScript文件中

形象解释Web标准:  
鹦鹉骨架就是HTML  
鹦鹉的羽毛就是CSS  
鹦鹉会飞的动作就是JS

相比较而言:结构最重要

1.  HTML语法规范  
    1.1 基本语法概述
    
    1.  HTML标签是由尖括号包围 的关键词,例如.
    2.  HTML标签通常是成对出现的,例如和,我们成为双标签.标签中第一个标签是开始标签,第二个是结束标签
    3.  有些特殊的标签必须是单个标签(极少情况), 例如  
        (单标签在/之前通常加一个空格),我们称之为单标签
2.  HTML基本结构标签  
    2.1 第一个HTML  
    每个网页都会有一个基本的结构标签(也称为骨架标签),页面内容也是在这些基本标签上书写

标签名 定义 说明

HTML标签 页面中最大的标签,我们成为根标签 文档的头部 注意在head标签中我们必须要设置的标签是title  文档的标题 让页面拥有一个属于自己的网页标题 文档的主题 元素包含文档的所有内容,页面的内容基本都是放到body里面的

1.  网页开发工具  
    3.1 文档类型声明标签 文档类型声明,作用就是告诉浏览器使用哪种HTML版本来显示网页 这句话的意思是:当前页面采取的是HTML5版本来显示网页  
    注意:
    
    1.  声明位于文档中的最前面的位置,处于 标签之前
    2.  不是一个HTML标签,它就是文档类型声明标签

3.2 lang语言种类  
用来定义当前文档显示的语言  
1. en定义语言为英语  
2. zh-CN定义语言为中文  
简单来说定义en就是英文网页,定义为zh-CN就是中文网页  
其实对于文档显示再说,定义为en的文档也可以显示中文,定义为zh-CN的文档也可以显示英文  
这个属性对浏览器和搜索引擎还是有作用的

3.3 字符集  
字符集(Character set)是多个字符的集合.以便计算机能够识别和存储各种文字  
在标签内,可以通过标签的charset属性来规定HTML文档应该使用哪种字符编码

charset常用的值有:GB2312/BIG5/GBK/UTF-8,其中UTF-8也被称为万国码,基本包含了全世界所有国家需要用到的字符
    注意:字符集设置是必须要写的,否则可能引起乱码的情况.

1.  HTML常用标签  
    4.2 标题标签
    
    # \- #
    
    ###### (重要)   为了使网页更具有语义化,我们经常会在页面中用到标题标签.HTML提供了6个等级 的网页标题,   即 ######
    
    # \- #
    
    ###### . ######
    
    # 我是一级标签 #
    
    单词head的缩写 标签语义:作为标题使用,并且依据重要性递减. 特点: 1.加了标题的文字变粗,自豪也会变大 2.一个标题独占一行

4.3 段落和换行标签(重要)  
在HTML中,一个段落中的文字会从左往右依次排列,直到浏览器窗口的右端,然后才自动换行.如果希望某段文本墙纸换行显示,就需要使用换行标签  
  
  
单词break的缩写.  
标签语义:强制换行  
特点:  
1.  
是个单标签.  
2.  
标签只是简单地开始新的一行,跟段落不一样,段落之前会插入一些垂直间距.

4.4 文本格式化标签  
在网页中,有时需要为文字设置粗体,斜体或者下划线等效果,这是就需要用到HTML中的文本格式化标签,使文字以特殊的方式显示.  
标签语义:突出重要性,比普通文字更重要.

语义	标签						说明
 加粗	或	更推荐使用标签加粗 语义更强烈
 倾斜	或			更推荐使用标签倾斜 语义更强烈
 删除线	<del></del>或<s></s>		更推荐使用<del>标签添加删除线 语义更强烈
 下划线	<ins></ins>或		更推荐使用<ins>标签添加下划线 语义更强烈

4.5

和 标签

和 是没有语义的,它们就是一个盒子,用来装内容的.

这是头部

今日价格 div 是 division 的缩写,表示分割,分区.span意为跨度,缩距 特点: 1.

标签用来布局,但是现在一行只能放一个

.大盒子. 2. 标签用来布局,一行上可以多个.小盒子.