转跳到内容

深夜萌新探索富文本编辑器ing~


只显示该作者

只有该作者的内容显示中。 返回到主题

推荐贴

发布于 (已修改)

<1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行 1px的自留首行>

FBI WARNING    本帖正在施工,欢迎提出建议和问题!

据本萌新了解,SS同盟由原本Discuz → 现今Invision Community,很多人对这个编辑器不是那么了解,所以我小小测试了一下。

先说结论,大家平时如果有排版的需求,可以在Word上操作后复制到此处,我也在这里提供一些常用格式与字符供大家复制。

(施工…………)

首先,我们平日里接触到的文本主要分两类。一类是我们在微信QQ等聊天框中打的纯文本;另一种是蕴含文字格式的富文本,如浏览器、Word。为什么浏览器中的文本可以千变万化,甚至可以交互呢?这一切都归功于它们都由HTML(超文本标记语言)编辑。与Word中的文字使用特定的XML语言——WordprocessingML(Word处理标记语言)类似,HTML语言通过成对的标签(如 <h1> 表示一级标题,<p> 表示段落,<a> 表示链接)来告诉浏览器:这行是标题,这片是正文,这个词点一下能跳转。浏览器读到这些标签后,就会按照默认样式(或者你额外写的CSS样式表)把它们渲染成五颜六色、大小不一的文字、图片、按钮甚至整个交互界面。

所以说Word和我们排版用的编辑器是在逻辑上类似的,又存在些许的隔阂,故而我们可以在Word这个易于可视化编辑的软件上进行修改,再复制到文本框内发布,但有时又会出现表格中图片复制不过来之类(可能,待验证,举例)的情况。

对于有过丰富HTML经验的盟友们,可以尝试直接通过HTML语言进行编写,会具有更强适配性(如在不同端查看不会变形)的优势。

————废墟一片————(里面是测试内容)

剧透

 <测试>

可用:点我跳转一楼 点我跳转第二页

【1】href+id锚点跳转

点我跳转到下面答案
跳转成功!能看到这个说明锚点没被过滤

【2】button按钮

点我弹窗

【3】style文字颜色样式

红色字蓝底白字

add:

🔹 文字样式大测试 🔹

· · 绿

黄黑 · 黑白 · 粉紫

12px · 16px · 24px · 32px

normal粗细 · 粗体bold · 更粗900 · 斜体

下划线 · 删除线 · 上划线 · 波浪下划线

宋体 · 微软雅黑 · 等宽Courier · 手写体

字间距2px · 紧缩-1px · 单词 间距 8px

渐变背景文字

普通阴影 · 发光红影 · 立体偏移

绿圆 · 红方

【4】details标签,被转成span吗

点我展开隐藏内容在这里

【5】iframe嵌入

【6】onmouseover鼠标悬停变色

把鼠标放我身上变橙色

【7】href普通超链接跳转

【8】script,被露头就秒了大雾

【9】audio音频

【测试块10】embed图片

正规detail
剧透

啦啦啦

 

接着测:

【基础核心排版标签】

核心排版: 粗体, 斜体, 下划线, 删除线, code, kbd, samp

这里是一个 blockquote 引用,通常会缩进。
  • 无序列表项 1
  • 无序列表项 2
  1. 有序列表项 1
  2. 有序列表项 2
// 代码块
function test(){
    console.log('Hello'); 
}

 

看来还是标准的好用:

#include <cstdio>
using namespace std;
int main() {
  printf("hello %d",1);
  return 0;
}
表格示例
表头1 表头2
单元格1 单元格2

【一般文字样式】

模拟按钮

模拟通知卡片

【可能的增量技术】

◉ 上/下标: 文字上标下标

◉ 缩写: HTML (鼠标悬停查看全称)

◉ 简单的SVG:  蓝色圆形=SVG存活。

◉ Data URI 测试: 点击查看数据URI文字

◉ 60% - Meter 元素

◉ 70% - Progress 元素

◉ 漢ㄏㄢˋ - Ruby 注音元素

圆角框

修改日志:

2026/4/25 2:12 基本测试完毕,解除版主观看限制。
2026/4/25 2:48 添加修改日志,添加正文,将测试内容收纳。

<留一行方便改>

,由zz137修改
不能当版本说明来用的修改理由不是好功能!
注释
ㅤ凯ㅤ ㅤ凯ㅤ 10.00节操 支持~
MCIN MCIN 66.00节操 !?强强?!

创建帐号或登入才能点评

您必须成为用户才能点评

创建帐号

在我们社区注册个新的帐号。非常简单!

注册新帐号

登入

已有帐号? 登入

现在登入
×
×
  • 新建...

重要消息

为使您更好地使用该站点,请仔细阅读以下内容: 使用条款