文章太单调?编辑器太简陋?且看如何用简单HTML标签丰富站内文章!

2019-10-18 15:23:34 32点赞 21收藏 45评论

前言

站内经常写原创的值友,大多都抱怨过大妈的编辑器难用且简陋,标题只有H1/H2两级,字体只有加粗功能,斜体、字号、颜色、下划线、删除线、角标等等等等等,全都没有……

当然,原创最重要的远是内容、内容、内容!但是适当的美化和排版,可以有更好的阅读体验也是不争的事实!所以也有很多值友开始使用MarkDown标记语言来丰富格式。

MarkDown部分基本语法与最终效果MarkDown部分基本语法与最终效果

MarkDown很方便,但是不知道什么情况,自己经常玩不转,搞好的格式,引入到站内编辑器,一看又给清了。于是又开始琢磨,除了MarkDown,还有什么比较简单的方法能实现美化的需求?这个时候,最基础的HTML语言就跳出来了,这个应该是大家基本都接触过的东西,不用很复杂就可以实现字体以及排版的简单美化。

这是我什么要水这篇文章的触发点这是我什么要水这篇文章的触发点

▲就是这个,让我觉得有必要水一篇文章,HTML我相信大家都学过,就是想不到要用,或者忘记了怎么用,所以我来做个搬运工,简单的把一些常用的语法罗列展示一下,后续如果有需求,大家直接抄作业就好了。


字体相关

  • 关于字体颜色

大妈的编辑器没有字体颜色可选择,但并不表示不支持彩色字体,可以用简单的font标签来实现调用。

标签格式:[font color=""]内容[/font](为避免编辑器直接调用,这边用"[]"替代了“<>”,实际使用时请自行替换,后续内容同,不再重复说明。)

其中color=“”可以用英文颜色表示,比如color=blue,即字体为蓝色,效果如:内容,如果要红色就是red,要绿色就是green,非常简单。

但是,如果我们是用非标准色呢?比如色卡上我看到一个颜色我想用,但是它既不是蓝色,也不是紫色,而是几种颜色混杂的,又该怎么办?

RGB颜色对照表-部分RGB颜色对照表-部分

▲这个时候,你就需要一份RGB颜色对照表了!比如我需要使用上图最左下角的颜色,且我知道了其RGB颜色编号为#6A5ACD,那么只要color=#6A5ACD就能应用到该颜色了!效果展示如:内容

  • 关于字体样式

大妈的编辑器只有粗体一种字体变换样式,相对比较单调,且字体大小也没得调整,当我们需要调整大小、使用下划线之类的怎么办?

  • 字体大小

标签格式:[font size=""]内容[/font]

其中,size即为字体大小,比如我设置6号字体,即为size=6,效果如:内容

  • 下划线

标签格式:[u]内容[/u]

用u标签把需要加下划线的框起来即可,实际效果如:内容

  • 删除线

标签格式:[del]内容[/del]

用del标签把需要加删除线的文字然后框起来即可,实际效果如:内容,这样的话,(这句删掉)之类的是不是就不用出现了?

  • 居中

标签格式:[center]内容[/center]

一般用于标题,可以把文字进行居中显示,实际效果如:

内容
  • 角标

标签格式:[sup]内容[/sup]或者[sub]内容[/sub]

分别是上下角标的标签格式,这个用的比较少,但是可以了解一下,保不齐什么时候会用到呢?实际效果为:内容TM 以及 内容ABC

基本以上几个就够用了。“另外,万维网联盟已从其标准中删除了字体标签,在未来,样式表(CSS)将用来定义布局,以及显示 HTML 元素的属性。”所以用HTML来设置字体为宋体之类的已行不通,甚至,大妈的编辑器也无法调用斜体标签。


段落相关

段落上面用的其实并不多,首行缩进之类的用空格就可以实现,也不用标签了;整段居中之类的,同样用center标签就行。我自己用到涉及段落的,最主要的还是分割线,通过分割线让段落划分更干净。

  • 分割线

标签格式:[hr color="" align="" width="" size="" noshade=""]

其中color为定义分割线的颜色,和字体颜色的标签一样使用,但是很奇怪,我至今未成功实现分割线改色,大妈的编辑器一直不认这个字段;

align为对齐方式,分为左对齐left,右对齐right,以及居中center;

width为分割线长度,可以用数字,也可以用百分比;

size为分割线宽度,用数字表示即可;

noshade则是定义分割线是否为纯色,可选定义noshade=true或弃用这一段

实际效果展示如下:

[hr align=right width=400 size=5 noshade=true],右对齐、长度400、宽度尺寸5:


[hr align=center width=50% size=5 ],居中对齐、长度50%、宽度尺寸5,非纯色:


除以上分隔线之外,暂未用到其他段落相关,间距行距之类的,调整没有多大意义(其实我懒得试,不知道大妈编辑器是否支持)。


总结

这次主要分享几个html的标签,来适当的美化文章的格式,因为需要各种效果呈现,所以通篇看上去比较乱,大家实际使用的时候,千万别一股脑全加上去,毕竟“乱就是艺术”也是相对来说的。另外,对应原创而言,格式以及字体美化,都是锦上添的事情,大家还是应该要首先注重内容的丰富性,因为归根到底,内容才是王道!不要学我一样成为一个大水笔……

本次分享到此结束,以上。

PS:另求赞、求收藏、求评论!


未经授权,不得转载
展开 收起

《凯叔讲故事》京东大礼包 音频节目

《凯叔讲故事》京东大礼包 音频节目

1元起

《52倍人生——戴锦华大师电影课》音频节目

《52倍人生——戴锦华大师电影课》音频节目

暂无报价

《不一样的新概念英语》【2+3合辑】音频节目

《不一样的新概念英语》【2+3合辑】音频节目

349.5元起

《安宁老师的日语课【0-N1》音频节目

《安宁老师的日语课【0-N1》音频节目

998元起

《陈见:如何释放性魅力》音频节目

《陈见:如何释放性魅力》音频节目

68元起

全新作品:《张震讲故事》惊魂季

全新作品:《张震讲故事》惊魂季

18.3元起

《谢涛有声历史剧:三国到明清》音频节目

《谢涛有声历史剧:三国到明清》音频节目

149.5元起

《齐俊杰:听得懂的50本财商经典书籍》音频节目

《齐俊杰:听得懂的50本财商经典书籍》音频节目

99.5元起

《旅の日本語:不用学的旅游日语》音频节目

《旅の日本語:不用学的旅游日语》音频节目

99元起

《30天旅游英语特训营》音频节目

《30天旅游英语特训营》音频节目

99元起

《曲黎敏:诗经之美》音频节目

《曲黎敏:诗经之美》音频节目

99.5元起

《给宝宝的第一堂启蒙英语课》音频节目

《给宝宝的第一堂启蒙英语课》音频节目

99元起

《跟德国总理的师妹学德语》音频节目

《跟德国总理的师妹学德语》音频节目

99元起

《老梁的四大名著情商课》 音频节目

《老梁的四大名著情商课》 音频节目

99.5元起

《学而思有趣的精品数学课》音频节目

《学而思有趣的精品数学课》音频节目

128元起

《儿童时间管理:8堂课秒杀磨蹭》音频节目

《儿童时间管理:8堂课秒杀磨蹭》音频节目

49元起
45评论

发表评论请 登录
  • 最新
  • 最热
评论举报

请选择举报理由

相关文章推荐

更多精彩文章
更多精彩文章
最新文章 热门文章
21
扫一下,分享更方便,购买更轻松