需要的样式如下图:
注:三级及之后使用相同符号。
需要的样式如下图:
注:三级及之后使用相同符号。
我搞明白了,我的列表跟你的有一点点不一样,我单独适配了三种情况,现在这个代码应该行了:
(刚刚更新了一下回帖,现在肯定行了)
/* 自定义无序列表样式 https://ld246.com/article/1706265880167?r=a2930610542 */
/* 无序列表块 */
[data-subtype="u"]>.li[data-subtype="u"]>.protyle-action svg{
color:transparent;
}
[data-subtype="u"]>.li[data-subtype="u"]>.protyle-action::before {
font-size: 1.5em;
line-height: 1;
margin-bottom: 0px;
margin-left:13px;
font-family: Arial;
content: "▪";
}
[data-subtype="u"]>[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "•";
}
[data-subtype="u"]>[data-subtype="u"] .li[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "◦";
}
/* 嵌入块 */
[class="protyle-wysiwyg__embed"]>.li[data-subtype="u"]>.protyle-action svg{
color:transparent;
}
[class="protyle-wysiwyg__embed"]>.li[data-subtype="u"]>.protyle-action::before {
font-size: 1.5em;
line-height: 1;
margin-bottom: 0px;
margin-left:13px;
font-family: Arial;
content: "▪";
}
[class="protyle-wysiwyg__embed"]>[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "•";
}
[class="protyle-wysiwyg__embed"]>[data-subtype="u"] .li[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "◦";
}
/* 浮窗 */
[class="protyle-wysiwyg protyle-wysiwyg--attr"][data-doc-type="NodeListItem"]>.li[data-subtype="u"]>.protyle-action svg{
color:transparent;
}
[class="protyle-wysiwyg protyle-wysiwyg--attr"][data-doc-type="NodeListItem"]>.li[data-subtype="u"]>.protyle-action::before {
font-size: 1.5em;
line-height: 1;
margin-bottom: 0px;
margin-left:13px;
font-family: Arial;
content: "▪";
}
[class="protyle-wysiwyg protyle-wysiwyg--attr"][data-doc-type="NodeListItem"]>[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "•";
}
[class="protyle-wysiwyg protyle-wysiwyg--attr"][data-doc-type="NodeListItem"]>[data-subtype="u"] .li[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "◦";
}
写好了,先试试看行不行,没 BUG 的话请采纳:
/* 自定义无序列表样式 https://ld246.com/article/1706265880167?r=a2930610542 */
[data-subtype="u"]>.li[data-subtype="u"]>.protyle-action svg{
color:transparent;
}
[data-subtype="u"]>.li[data-subtype="u"]>.protyle-action::before {
font-size: 1.5em;
line-height: 1;
margin-bottom: 0px;
margin-left:13px;
font-family: Arial;
content: "▪";
}
[data-subtype="u"]>[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "•";
}
[data-subtype="u"]>[data-subtype="u"] .li[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "◦";
}
我不明白你那里是什么情况,我这里是没问题的:
可能跟什么插件或者代码片段冲突了,每行都加 !important 试试:
/* 自定义无序列表样式 https://ld246.com/article/1706265880167?r=a2930610542 */
[data-subtype="u"] > .li[data-subtype="u"] > .protyle-action svg {
color: transparent !important;
}
[data-subtype="u"] > .li[data-subtype="u"] > .protyle-action::before {
font-size: 1.5em !important;
line-height: 1 !important;
margin-bottom: 0px !important;
margin-left: 13px !important;
font-family: Arial !important;
content: "▪" !important;
}
[data-subtype="u"] > [data-subtype="u"] .li[data-subtype="u"] > .protyle-action::before {
content: "•" !important;
}
[data-subtype="u"] > [data-subtype="u"] .li[data-subtype="u"] .li[data-subtype="u"] > .protyle-action::before {
content: "◦" !important;
}
可能之前的代码的缩进有点问题,我稍微改了一下,你再用这个试试看:
/* 自定义无序列表样式 https://ld246.com/article/1706265880167?r=a2930610542 */
[data-subtype="u"]>.li[data-subtype="u"]>.protyle-action svg{
color:transparent;
}
[data-subtype="u"]>.li[data-subtype="u"]>.protyle-action::before {
font-size: 1.5em;
line-height: 1;
margin-bottom: 0px;
margin-left:13px;
font-family: Arial;
content: "▪";
}
[data-subtype="u"]>[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "•";
}
[data-subtype="u"]>[data-subtype="u"] .li[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "◦";
}
我搞明白了,我的列表跟你的有一点点不一样,我单独适配了三种情况,现在这个代码应该行了:
(刚刚更新了一下回帖,现在肯定行了)
/* 自定义无序列表样式 https://ld246.com/article/1706265880167?r=a2930610542 */
/* 无序列表块 */
[data-subtype="u"]>.li[data-subtype="u"]>.protyle-action svg{
color:transparent;
}
[data-subtype="u"]>.li[data-subtype="u"]>.protyle-action::before {
font-size: 1.5em;
line-height: 1;
margin-bottom: 0px;
margin-left:13px;
font-family: Arial;
content: "▪";
}
[data-subtype="u"]>[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "•";
}
[data-subtype="u"]>[data-subtype="u"] .li[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "◦";
}
/* 嵌入块 */
[class="protyle-wysiwyg__embed"]>.li[data-subtype="u"]>.protyle-action svg{
color:transparent;
}
[class="protyle-wysiwyg__embed"]>.li[data-subtype="u"]>.protyle-action::before {
font-size: 1.5em;
line-height: 1;
margin-bottom: 0px;
margin-left:13px;
font-family: Arial;
content: "▪";
}
[class="protyle-wysiwyg__embed"]>[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "•";
}
[class="protyle-wysiwyg__embed"]>[data-subtype="u"] .li[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "◦";
}
/* 浮窗 */
[class="protyle-wysiwyg protyle-wysiwyg--attr"][data-doc-type="NodeListItem"]>.li[data-subtype="u"]>.protyle-action svg{
color:transparent;
}
[class="protyle-wysiwyg protyle-wysiwyg--attr"][data-doc-type="NodeListItem"]>.li[data-subtype="u"]>.protyle-action::before {
font-size: 1.5em;
line-height: 1;
margin-bottom: 0px;
margin-left:13px;
font-family: Arial;
content: "▪";
}
[class="protyle-wysiwyg protyle-wysiwyg--attr"][data-doc-type="NodeListItem"]>[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "•";
}
[class="protyle-wysiwyg protyle-wysiwyg--attr"][data-doc-type="NodeListItem"]>[data-subtype="u"] .li[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "◦";
}
想要代码行数少一点的话,就用这个:
/* 自定义无序列表样式 https://ld246.com/article/1706265880167?r=a2930610542 */
/* 无序列表块、嵌入块、浮窗聚焦 */
[data-subtype="u"]>.li[data-subtype="u"]>.protyle-action svg,
[class="protyle-wysiwyg__embed"]>.li[data-subtype="u"]>.protyle-action svg,
[class="protyle-wysiwyg protyle-wysiwyg--attr"][data-doc-type="NodeListItem"]>.li[data-subtype="u"]>.protyle-action svg{
color:transparent;
}
[data-subtype="u"]>.li[data-subtype="u"]>.protyle-action::before,
[class="protyle-wysiwyg__embed"]>.li[data-subtype="u"]>.protyle-action::before,
[class="protyle-wysiwyg protyle-wysiwyg--attr"][data-doc-type="NodeListItem"]>.li[data-subtype="u"]>.protyle-action::before{
font-size: 1.5em;
line-height: 1;
margin-bottom: 0px;
margin-left:13px;
font-family: Arial;
content: "▪";
}
[data-subtype="u"]>[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before,
[class="protyle-wysiwyg__embed"]>[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before,
[class="protyle-wysiwyg protyle-wysiwyg--attr"][data-doc-type="NodeListItem"]>[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "•";
}
[data-subtype="u"]>[data-subtype="u"] .li[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before,
[class="protyle-wysiwyg__embed"]>[data-subtype="u"] .li[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before,
[class="protyle-wysiwyg protyle-wysiwyg--attr"][data-doc-type="NodeListItem"]>[data-subtype="u"] .li[data-subtype="u"] .li[data-subtype="u"]>.protyle-action::before{
content: "◦";
}
Love2D 是一个开源的, 跨平台的 2D 游戏引擎。使用纯 Lua 脚本来进行游戏开发。目前支持的平台有 Windows, Mac OS X, Linux, Android 和 iOS。
Cloud Foundry 是 VMware 推出的业界第一个开源 PaaS 云平台,它支持多种框架、语言、运行时环境、云平台及应用服务,使开发人员能够在几秒钟内进行应用程序的部署和扩展,无需担心任何基础架构的问题。
FreeMarker 是一款好用且功能强大的 Java 模版引擎。
SpaceVim 是一个社区驱动的模块化 vim/neovim 配置集合,以模块的方式组织管理插件以
及相关配置,为不同的语言开发量身定制了相关的开发模块,该模块提供代码自动补全,
语法检查、格式化、调试、REPL 等特性。用户仅需载入相关语言的模块即可得到一个开箱
即用的 Vim-IDE。
Maven 是基于项目对象模型(POM)、通过一小段描述信息来管理项目的构建、报告和文档的软件项目管理工具。
Kubernetes 是 Google 开源的一个容器编排引擎,它支持自动化部署、大规模可伸缩、应用容器化管理。
Hprose 是一款先进的轻量级、跨语言、跨平台、无侵入式、高性能动态远程对象调用引擎库。它不仅简单易用,而且功能强大。你无需专门学习,只需看上几眼,就能用它轻松构建分布式应用系统。
房星网,我们不和没有钱的程序员谈理想,我们要让程序员又有理想又有钱。我们有雄厚的房地产行业线下资源,遍布昆明全城的 100 家门店、四千地产经纪人是我们坚实的后盾。
Node.js 是一个基于 Chrome JavaScript 运行时建立的平台, 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动, 非阻塞 I/O 模型而得以轻量和高效。
快应用 是基于手机硬件平台的新型应用形态;标准是由主流手机厂商组成的快应用联盟联合制定;快应用标准的诞生将在研发接口、能力接入、开发者服务等层面建设标准平台;以平台化的生态模式对个人开发者和企业开发者全品类开放。
ReactiveX 是一个专注于异步编程与控制可观察数据(或者事件)流的 API。它组合了观察者模式,迭代器模式和函数式编程的优秀思想。
HHKB 是富士通的 Happy Hacking 系列电容键盘。电容键盘即无接点静电电容式键盘(Capacitive Keyboard)。
Chrome 又称 Google 浏览器,是一个由谷歌公司开发的网页浏览器。该浏览器是基于其他开源软件所编写,包括 WebKit,目标是提升稳定性、速度和安全性,并创造出简单且有效率的使用者界面。
腾讯公司 2011 年 1 月 21 日推出的一款手机通讯软件。用户可以通过摇一摇、搜索号码、扫描二维码等添加好友和关注公众平台,同时可以将自己看到的精彩内容分享到微信朋友圈。
jsoup 是一款 Java 的 HTML 解析器,可直接解析某个 URL 地址、HTML 文本内容。它提供了一套非常省力的 API,可通过 DOM,CSS 以及类似于 jQuery 的操作方法来取出和操作数据。
Solidity 是一种智能合约高级语言,运行在 [以太坊] 虚拟机(EVM)之上。它的语法接近于 JavaScript,是一种面向对象的语言。
Sublime Text 是一款可以用来写代码、写文章的文本编辑器。支持代码高亮、自动完成,还支持通过插件进行扩展。
Wide 是一款基于 Web 的 Go 语言 IDE。通过浏览器就可以进行 Go 开发,并有代码自动完成、查看表达式、编译反馈、Lint、实时结果输出等功能。
欢迎访问我们运维的实例: https://wide.b3log.org
沉迷游戏伤身,强撸灰飞烟灭。
ActiveMQ 是 Apache 旗下的一款开源消息总线系统,它完整实现了 JMS 规范,是一个企业级的消息中间件。
Thymeleaf 是一款用于渲染 XML/XHTML/HTML5 内容的模板引擎。类似 Velocity、 FreeMarker 等,它也可以轻易的与 Spring 等 Web 框架进行集成作为 Web 应用的模板引擎。与其它模板引擎相比,Thymeleaf 最大的特点是能够直接在浏览器中打开并正确显示模板页面,而不需要启动整个 Web 应用。
Mac 是苹果公司自 1984 年起以“Macintosh”开始开发的个人消费型计算机,如:iMac、Mac mini、Macbook Air、Macbook Pro、Macbook、Mac Pro 等计算机。