html加载富文本_HTML基础

最新推荐文章于 2024-07-15 03:21:08 发布

weixin_39830323

最新推荐文章于 2024-07-15 03:21:08 发布

阅读量2.1k

点赞数

文章标签： html加载富文本 html网页放大时文字不换行该页面仅以HTML格式保存

主流浏览器内核

IE/Edge - Trident
FireFox - Gecko
Safari - Webkit
Chrome - Webkit 升级到 Blink
Opera - Presto 升级到 Webkit 升级到 Blink

HTML

HTML叫做超文本标记语言(Hypertext Markup Language) ,用于搭建网页的结构
HTML是一种纯文本格式的文件，内部只能书写文字内容，不能添加图片、音频、视频等，但是在网页中给用户呈现的效果却包含了文字以外的内容，这种效果就是HTML语言区别于其他文件的不同之处

网页的组成前端三层

前端三层: HTML (结构层)、Css(样式层)、JavaScript (行为层)

HTTP协议

Hypertext Transfer Protocol:超文本传输协议。是客户端浏览器或其他程序与WEB服务器之间的应用层通信协议
HTTP请求 HTTP响应

纯文本格式

纯文本格式，就是没有任何文本修饰的，没有任何粗体,下划线,斜体,图形,符号或特殊字符及特殊打印格式的文本,只保存文本,不保存其格式设置

格式对比

纯文本格式 - 最常见的是.txt文件。在存储和传输过程中,只能保存文字,不能保存内容
纯文本格式特点:

文件只能保存文本，不保存其他的格式或非文本内容，有利于网络传输
所有的纯文本格式文件，可以通过直接更改扩展名的方式更改保存格式
纯文本格式文件可以使用任意的纯文本编辑器进行查看和编辑

富文本格式 - 与纯文本对应，最常见的是.rtf文件，类似.doc文件，内部可以保存文本的样式、图片等
html css js文件都是纯文本格式文件

标签级别

根据标签内部可以存放的元素内容不同，可以将双标签划分为两个级别
容器级:标签内部可以存放任意内容，包含容器级标签。比如h1, div等
文本级:标签内部只能存放文字或类似文字的内容，比如存放图片、表单元素等。比如p等

HTML元素的特性

元素间对空格、换行、缩进等形成的空白不敏感，有无空白对在浏览器中加载的效果没有影响。浏览器识别的是元素的开始和结束以及互相之间的嵌套关系。

<p>段落内容</p><p>段落内容</p><p>段落内容</p><p>段落内容</p><p>段落内容</p>

空白折叠现象:元素内容如果是文本，所有文字(类似文字内容)之间如果有空格、换行、缩进等空白字符，在浏览器中加载时，连接在一起的空白会折叠成一个空格显示，这就是空白折叠现象

HTML属性规范

1.书写位置:必须写在开始标签或者单标签之内，与标签名之间用空格进行分隔
2.属性包含:属性名(key) 、属性值(value) 。属性名与属性值之间的写法通常称做键值对写法，HTML标签属性的键值对写法是k=”v”。XHTML要求属性值必须在双引号内部<p k="v">

3.一个标签内可以设置多个不同的属性，属性与子性之间使用空格进行分隔，每个属性的键值对写法都是k="v"

<p k="v" k="v" k="v"></p>

浏览器打开快捷键

alt + b 提前安装好 open in browser插件
Mac 复制单行快捷键 alt + shift + ⬆️⬇️
按住鼠标滚轮拖动，可以输入多行文字
ctrl + enter 自动换行

title标签

作用1: 让页面拥有一个属于自己的标题
作用2: title中的关键字可以作为搜索引擎抓取时的关键字，提高SEO搜索引擎优化
作用3: 内部的内容会显示在搜索结果的标题部分
作用4: 作为浏览器收藏夹默认的网页标题
建议网页必须添加title标签内部内容，内容尽量精简，提取网页的关键字

DTD

完整的HTML文件的第一行内容叫做文档定义类型，英文DocType Definition,简称DTD。也称作文档声明类型，DocType Declaration
作用:告知浏览器该网页使用的是哪个版本的HTML规范，让浏览器按照对应版本的HTML语法进行解析页面

不同版本的DTD

XHTML1.O版本

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

HTML5 版本

<!DOCTYPE html>

注释语法

在很多代码技术中都可以添加注释内容，我们也可以向HTML源代码添加注释
HTML注释语法:

快捷键：ctrl + /

标题标签

标题(Heading),是通过<h1>-<h6>六个标签分别来对六个级别的标题进行定义的
<h1>定义最大的标题，<h6> 定义最小的标题
<h1>- <h6>标签都是双

最低0.47元/天解锁文章