微信公众号高级编辑排版 —— 第一节初识HTML代码

Author Avatar
Rui 01月 14,2021
  • 在其它设备中阅读本文章

HTML语言是啥

HTML本质是超文本标记语言

HTML作用,将所需要表达的信息按某种规则写成HTML文件,通过专用的浏览器来识别,并将这些HTML文件“翻译”成可以识别的信息,即现在所见到的网页。

HTML小作文长啥样

image.png

HTMl语言由标签构成,包括从开始标签(start tag)和结束标签(end tag);其中可以嵌套标签或内容。

为方便编辑代码时分辨标签,同一层级的开始与结束标签位于同一列,不同层级标签之间层层递进,在编辑时良好的缩进习惯可以避免因标签重复或缺失导致出bug。

为方便开发者编辑,市面上有不少代码格式化插件自动调整缩进,可根据自己使用的编辑器,搜索了解。

在微信公众号平台常见的HTML标签

节标签 (section)

<section> 标签定义文档中的节(section、区段)。

段落标签(p)

<p> 标签定义段落。

换行符(br)

<br> 可插入一个简单的换行符(回车)。

超链接(a)

<a> 标签定义超链接,用于链接到另一张页面。
<a> 元素最重要的属性是 href 属性,它指示链接的目标。

SVG标签(svg)

<svg> 在页面中摊开一张svg画布

绘制svg画面的各种标签

<g> 编组标签,将不同内容编组。

<rect> 矩形

<cicle> 圆形

<ellipse> 椭圆

<line> 线

<polyline> 折线

<polygon> 多边形

<path> 路径

<text><tspan> 文本

<foreignObject> 引入外部元素

制作svg动效的白名单标签

<animate>

<set>

<animateTransform>

<animateMotion>

具体介绍请跳转 微信公众号平台——图文范畴内 SVG AttributeName 白名单规范介绍

课后学习

使用编辑器进行排版后,将排版编辑页面转为代码模式,查看代码。并通过搜索了解标签含义以及HTML属性含义。