文档树最好的彩色样式,给予参考

如视频所展示的一样,这是我在 trilium 上的一个大神写的文档树 css,区别于彩色的背景太过于饱满而显得过于疲倦,只展示悬停才出现颜色,左侧以线段进行归属哪个层级,这是我认为文档树最好的彩色样式。

但我不懂代码,如果有大佬觉得这个不错,可以写一个代码片段适配到思源上。

这是 trilium 大神写的代码,是以 trilium 主题为载体 https://github.com/SiriusXT/trilium-theme-blue

而我在此基础上自己瞎琢磨修改的颜色的代码,有些自己加了#号

```undefined /* Blue theme https://github.com/SiriusXT/trilium-theme-blue version:0.3 for trilium:>0.58.4 云遥修改版,基于Blue theme 做出适合自己的修改 */ /* 感谢云遥大佬的修改版 在云遥修改版的基础上又进行了一些符合自己习惯的调整 */ /*云遥改动处 */ :root { --main-background-color: #f3f8e8; ; /* #F2F2F2 */ /*这里调整背景颜色,并不只是编辑区。*/ /* --launcher-pane-background-color: #FFFFFF; /*应该是左侧启动器最左边的那个东西的颜色*/ --main-font-family: 'Roboto Condensed'; /* 定义字体,三个字体都是拷贝的主题Linen的设置 */ --detail-font-family: 'Crimson Pro'; --monospace-font-family: 'Cousine'; } div#toast-container { right: 0px !important; bottom: 0px !important; top: auto !important; width: auto !important; } .switch-widget span.slider.checked { background-color: var(--color-blue-light) !important; } div.note-detail div.ck-horizontal-line.ck-widget { margin-top: 10px !important; } .ck-content hr { margin-bottom: 10px !important; } body, span.fancytree-title { font-family: var(--detail-font-family) !important; } /*搜索时候的关键字颜色*/ .ck-find-result { background: #b9d2ff; color: var(--ck-color-text); } span:not(.fancytree-active) span.fancytree-title { font-weight: 500 !important; } /*目录边界的控制*/ #right-pane .card-body { padding: 1px !important; padding-top: 1px; padding-right: 1px; padding-bottom: 1px; padding-left: 1px; } /*目录左右两边边距控制*/ .toc-widget { padding: 15px !important; } #launcher-pane .launcher-button { color: #F0F4F4 !important; /* 云遥改动处 ,原值 f0f4f4*/ background-color: var(--color-blue-light) !important; } .global-menu { background-color: var(--color-blue-light); width: 44px !important; } ul.fancytree-container li { contain: initial; } /*这里是左上角的选项图标,新加了一行是控制图标大小的,新版本图标默认很大,所以需要大小控制*/ .global-menu-button { background-image: url("../../../favicon.ico") !important; background-size: 35px !important; } /*受保护的标题*/ #center-pane .title-row .note-title-widget input.note-title.protected { text-shadow: 1px 1px px var(--muted-text-color); } div#launcher-pane.component { width: 44px !important; } #launcher-pane .launcher-button { width: 44px !important; padding: initial !important; } div.spacer.component { background-color: var(--color-blue-light) !important; width: 44px; } .dropdown, .dropleft, .dropright, .dropup { position: initial; } .sync-status .sync-status-icon { padding: 13px 8px 8px 8px; } .sync-status .sync-status-icon span { padding: 13px 8px 8px 8px; } #left-pane input.search-string { background: rgba(255, 255, 255, 0.3) !important; } div.quick-search.input-group.input-group-sm.component { align-content: center; } span.fancytree-node:not(.fancytree-folder) .fancytree-expander::before { content: "\ec21" !important; visibility: visible !important; color: rgba(51, 51, 51, 0.1) !important; } div#root-widget div.gutter-horizontal { background: var(--color-gray-light); width: 5px !important; border-left: var(--border-standard); border-radius: 0; padding-right: 0.3rem; border-right: var(--border-standard); } /*打开的页面的图标的样式*/ #center-pane .title-row .note-icon-widget button { display: flex; color: #9e49bb; margin: 0; } /*这里是一级标题部分*/ #center-pane .title-row .note-title-widget input.note-title { color: var(--color-blue-dark) !important; } .note-title-widget input.note-title.protected { text-shadow: 0px 0px 0px var(--muted-text-color); } input.note-title { font-family: var(--detail-font-family) !important; font-weight: bold; } .bx-dock-right::before { vertical-align: middle; } button.ck.ck-block-toolbar-button { background-color: rgba(255, 255, 255, 0); } html { --color-blue-light: #59AC80; --color-blue-light-alpha: #ABD49D; /* 当前活动标签页的背景色,原值#4682B470 */ --color-gray: #d6d6d6; --color-gray-light: #59AC80; /* 至少这里是非活动标签、两侧分隔栏的颜色 */ --accented-background-color: #B2E8C6; /* 这个才是卡片背景颜色 */ --more-accented-background-color: #8AE097; /* 这个是鼠标悬浮在卡片上时的背景颜色 */ --left-pane-background-color: #FDF5EA; /* 这个才是正儿八经的文件树的背景色 */ --color-gray-light-text: #000000; /* 至少是非活动标签的字的颜色 */ --color-gray-light-alpha: rgba(199, 199, 199, 0.2); --border-standard: 1px solid var(--color-gray); --color-blue-dark: #296e42; --link-color: #007BFF !important; --menu-background-color: #F3F9F1; /* 快速搜索结果的卡片的背景色 */ } div#root-widget div#rest-pane div.tab-row-widget div.note-new-tab { color: var(--color-gray-dark); background-color: var(--color-gray-light-alpha); } div#rest-pane>div.component { height: 30px !important; margin-bottom: 1px !important; } .note-new-tab { width: 30px !important; height: 30px !important; font-size: 19px !important; } .tab-row-widget .note-tab .note-tab-close span { font-size: 23px !important; } div#root-widget div#rest-pane div.tab-row-widget div.note-new-tab:hover { color: var(--color-blue-light); background-color: var(--color-blue-light-alpha); } div#rest-pane div.tab-row-widget div.tab-row-widget-container div.note-tab div.note-tab-wrapper { background-color: var(--color-gray-light); color: var(--color-gray-light-text); padding: 3px 5px 1px 5px !important; height: 30px !important; } div#rest-pane div.tab-row-widget div.tab-row-widget-container div.note-tab div.note-tab-wrapper:hover { background-color: var(--color-blue-light-alpha); } div#rest-pane div.tab-row-widget div.tab-row-widget-container div.note-tab div.note-tab-wrapper>div:hover { background: none; } /*当前选中标签的字的颜色 */ div#rest-pane div.tab-row-widget div.tab-row-widget-container div.note-tab[active] .note-tab-wrapper { color: #146e20; background-color: var(--color-blue-light-alpha); } div#rest-pane div.tab-row-widget div.tab-row-widget-container div.note-tab[active] .note-tab-wrapper div.note-tab-title::before { content: "\203B "; margin-right: 5px; } /* 左侧面板背景图片,由于整个笔记的背景都换了,这个优先级不够高,故注释掉 */ /*#left-pane.component { background-image: url("/custom/background.png"); } */ #线条 li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n) { border-left: 4px solid#F9950A !important; border-top-left-radius: 10px !important; border-bottom-left-radius: 10px !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+1) { border-left: 4px solid #30db5b !important; border-top-left-radius: 10px !important; border-bottom-left-radius: 10px !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+2) { border-left: 4px solid #409cff; border-top-left-radius: 10px !important; border-bottom-left-radius: 10px !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+3) { border-left: 4px solid #ff6482; border-top-left-radius: 10px !important; border-bottom-left-radius: 10px !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+4) { border-left: 4px solid #ffd426; border-top-left-radius: 10px !important; border-bottom-left-radius: 10px !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+5) { border-left: 4px solid #d48fff; border-top-left-radius: 10px !important; border-bottom-left-radius: 10px !important; } #li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n):hover { background-color: #f4a6a601 !important; } #li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+1):hover { --border-background-color: #84D5BD !important; } #li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+2):hover { background-color: #719ACE !important; } #li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+3):hover { background-color: #F3D48C !important; } #li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+4):hover { background-color: #FEB4AD !important; } #li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+5):hover { background-color: #A5ACE2 !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n)>span.fancytree-node:hover { background-color: #F8B811 !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+1)>span.fancytree-node:hover { background-color: #8AE097 !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+2)>span.fancytree-node:hover { background-color: #A6C6FD !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+3)>span.fancytree-node:hover { background-color: #FEB4AD !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+4)>span.fancytree-node:hover { background-color: #F7DB8A !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+5)>span.fancytree-node:hover { background-color: #C5BCF0 !important; } .fancytree-node { padding-top: 0px !important; padding-bottom: 0px !important; } span.fancytree-node.fancytree-active { border-radius: 0px !important; border: 0px !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n)>span.fancytree-node.fancytree-active { background-color: #F8B811 !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+1)>span.fancytree-node.fancytree-active { background-color: #8AE097 !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+2)>span.fancytree-node.fancytree-active { background-color: #A6C6FD !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+3)>span.fancytree-node.fancytree-active { background-color: #FEB4AD !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+4)>span.fancytree-node.fancytree-active { background-color: #F7DB8A !important; } li.fancytree-lastsib ul li[role='treeitem']:nth-of-type(6n+5)>span.fancytree-node.fancytree-active { background-color: #C5BCF0 !important; } span.button-widget.icon-action.bx.component.bx-history, .ribbon-button-container .icon-action { padding-top: 5px !important; } span.fancytree-node:hover { border: 0px !important; } span.fancytree-node { border: 0px !important; } .title-bar-buttons div button.icon-action { font-size: 80% !important; } /*右侧目录*/ /*如果不带!important优先级别较低,所以不会使用*/ .toc ol { padding-left: 25px !important; } div.note-detail p { font-size: 1.25rem; /* 云遥改动处,加入这一行,修改字体大小 */ margin-top: 0.1rem !important; margin-bottom: 0.5rem !important; line-height: 2.25rem; /* 行高,,减去1.25的字体大小,行距为 1 */ text-indent: 0em; /* 云遥改动处,2em修改为0em,去除缩进2个字符 */ text-align: justify; text-justify: distribute; } dl, ol, ul { padding-left: 1em; } /*列表的字体大小*/ div.note-detail ul>li, ol>li { font-size: 1.3rem; /* 云遥改动处,修改了列表项的字体大小 */ text-align: justify; text-justify: distribute; } blockquote>p { text-indent: 0em; /* 引用块去除缩进,原作者貌似在0.58.4的主题里就是0em,但上一个版本是2em */ } p>span.ck-math-tex { text-indent: 0em; } .note-detail { line-height: 2.25rem; } .ck-content p>span.image-inline { vertical-align: middle; } .ck-content figure.image { margin-top: 0.2rem; margin-bottom: 0.2rem; } div.note-detail.component span.image-inline { border: 1px dashed rgb(200, 200, 200); } div.note-detail.component figure.image { border: 1px dashed rgb(200, 200, 200); } ::selection { background-color: rgba(70, 130, 180, 0.7) !important; } .note-properties-widget { padding: 0px !important; } .note-icon-widget.dropdown.component { padding-top: 1.5px !important; } .basic-properties-widget>* { margin-top: 0px !important; } div.attribute-list { margin-top: 0px !important; } .basic-properties-widget { padding: 0px 12px 0px 12px !important; } .component { padding-top: 0px !important; padding-bottom: 0px !important; } .inherited-attributes-container { padding: 0px 12px 0px 12px !important; } .add-new-attribute-button, .save-attributes-button { bottom: 0px !important; } ::-webkit-scrollbar-thumb { border-radius: 5px !important; background: rgba(0, 0, 0, 0.2) !important; } ::-webkit-scrollbar { height: 12px; } /* 这里才是卡片背景颜色*/ div#center-pane .note-book-card { border: 1px solid rgba(128, 128, 128, 0.5) !important; } #center-pane div.note-detail-editable-text div.note-detail-editable-text-editor.ck.ck-content pre, #center-pane .CodeMirror pre code { color: var(--color-blue-dark) !important; padding: 0.2em; margin: 0.5rem auto 0.5rem; background-color: var(--color-gray-light); border: 1px dotted var(--color-gray); } .ck.ck-editor__editable pre[data-language]::after { background: rgba(10, 10, 10, 0.1); } /*编辑模式下代码背景色*/ .ck.ck-editor__editable .ck-code_selected { background-color: hsla(0,0%,51%,36%) !important; } /*浏览模式下代码背景色*/ .ck-content code { background-color: hsla(0,0%,51%,36%) ;/*这里如果加上了"!important" 那么代码块中也会受到影响,所以去掉后就正常了*/ } span.katex * { font-family: KaTeX_Main !important; font: KaTeX_Main, Times New Roman, serif !important; } .katex-display { margin: 0.1rem 0; } /*后代选择器,选中.ck-content下的引用块元素设置样式*/ .ck-content blockquote { font-style: initial !important; color: #2C3E50 !important; border-left: 5px solid #D6DBDF !important; /* 云遥改动处 */ /* 原值 background: none repeat scroll 0 0 rgba(102, 128, 153, .05) !important; */ /*引用块颜色,这里要使用不透明的,否则如果使用rgba的话,会和底色叠加,不好估计是什么颜色*/ background: none repeat scroll 0 0 rgb(169, 299, 178) !important; padding: 2px 1px 3px !important; margin: 0.2rem 0 0 0 !important; } /*子元素选择器,选中引用块里的p元素,也就是文字元素,设置样式*/ blockquote>p { margin-bottom: 0 !important; text-indent: 0em !important; /* 云遥改动处,引用块文字去除缩进,原值1.7em,改为0*/ } dl, ol, ul { margin-bottom: 0.1rem !important; } .ck-content .table { margin-top: 0.1rem; margin-bottom: 0.1rem; } /*这里注释掉是因为暂时不知道有什么用,好像也没啥用*/ /* a[href^="#root"] { } */ html body.mobile.heading-style-plain div#root-widget.component div#launcher-pane.component div#launcher-container.component div.spacer.component { background-color: var(--color-blue-light); /*不知道是干啥的*/ width: 44px !important; } /*云遥改动处,列表项第一级显示实心圆而不是空心圆 */ .ck-content ul { list-style-type: disc; line-height: 2.25rem; /*行高*/ } /*不知道是版本问题还是什么,这部分是右侧目录的颜色*/ ol li { /*一级目录*/ color: #000000; line-height: 2.25rem; /*行高 */ } ol ol>li { /*二级目录*/ color: #0a84ff; line-height: 2.25rem; } ol ol>ol>li { /*三级目录*/ color: #ff2d55; line-height: 2.25rem; } ol ol>ol>ol>li { /*四级目录*/ color: #e6952f; line-height: 2.25rem; } ol ol>ol>ol>ol>li { /*五级目录*/ color: #af52de; line-height: 2.25rem; } /*这部分才是有序列表的颜色*/ ol>li { /*有序列表,第一层*0075cb/ color: #F9C40A; line-height: 2.25rem; /*行高 */ } ol>li>ol>li { /*有序列表,第二层*/ color: #0094c1; line-height: 2.25rem; } ol>li>ol>li>ol>li { /*有序列表,第三层*/ color: #3c32bd; line-height: 2.25rem; } ol>li>ol>li>ol>li>ol>li { /*有序列表,第四层*/ color: #bb4ead; line-height: 2.25rem; } ol>li>ol>li>ol>li>ol>li>ol>li { /*有序列表,第五层*/ color: #ff9354; line-height: 2.25rem; } /*编辑模式下有序列表边框有限制,导致10,这种只会显示0,所以特意设置下边距*/ .ck.ck-editor__editable_inline { padding-left: 17px; } /*浏览模式下右边控制有点冲突,有些会被挡住强迫症很难受所以特意设置下边距*/ .note-detail-readonly-text { padding-right: 6px; } /*这个就是无序列表项、有序列表项前面的那个圈圈或者数字标识的颜色*/ ::marker { color: #4682B4; } /*编辑模式下,代码块背景颜色*/ #center-pane div.note-detail-editable-text div.note-detail-editable-text-editor.ck.ck-content pre, #center-pane .CodeMirror pre code { color: var(--color-blue-dark) !important; padding: 0.2em; margin: 0.5rem auto 0.5rem; background-color: #FFFAFA; /*这部分是控制代码块边缘的阴影的,使代码块看起来更像一个单独的块*/ border: 1px solid #a5a5a5; } /*只读模式下,代码块背景颜色 */ .ck-content pre { background: #FFFAFA; border: 1px solid #a5a5a5; border-radius: 2 px; color: #353535; direction: ltr; font-style: normal; min-width: 200 px; padding: 1 em; tab-size: 4; text-align: left; white-space: pre-wrap; } /* #root-widget.component { background-image: url("/custom/background.png"); background-size: 100% 100%; } */ .ck .ck-link_selected { background-color: #F2F2F2; } /*列表的标签数字*/ ::marker { color: #886bbf; }
  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    26296 引用 • 109309 回帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • heeeeeee

    有思源大佬觉得这个 css 不错,可以制作一个代码片段,我是真的很想适配到思源笔记上 ❤️

  • pakeh2866

    还要改啥,AI 再加工一下?

    1 回复
  • Mayrain

    好……好花哨……

    不会觉得这么多色彩比较刺眼嘛,感觉文档层次都不太清楚了(

    image.png

    我的是这样的,自我感觉又简洁又好看(个人想法)

    另外有代码的话就可以直接交给 ai 改一下就变成 css 代码段了吧

  • heeeeeee

    这是 trilium 的代码,不上思源上的代码片段

  • Floria233

    楼主,给你几个链接参考,你看一下可否满足你的需求。

    【主题宣传】OneNote 主题回归思源 - 链滴

    about 文档树的彩虹目录 - 链滴

    多彩文档树 - 链滴

    1 回复
  • 觉得非常好看 还是不错的 加油

  • 收藏 都非常好

  • HugZephyr

    你这个样式有点好看,我去调一调我自己的多彩文档树

  • heeeeeee

    如果有大佬欣赏这个 trilium 的文档树的彩色样式,可以参考我列出的 trilium 代码进行修改到思源上,我不懂代码,所以我无法自行适配到思源上。要是有大佬适配到思源上的,麻烦分享一下代码片段 😄

  • shiyuankill

    持续关注

  • HugZephyr

    改好了, 应该符合你的需求, 还可以参考下这里的说明: [css] 多彩文档树竖线 -- 按层级区分颜色

    图片.png

    /* [css片段] 多彩文档树竖线_按位置 */ :root { /* 竖线颜色 */ --vertical-line-color-1: var(--b3-font-background8); --vertical-line-color-2: var(--b3-font-background7); --vertical-line-color-3: var(--b3-font-background6); --vertical-line-color-4: var(--b3-font-background11); /* 悬浮颜色 */ --file-hover-color-1: var(--b3-font-background1); --file-hover-color-2: var(--b3-font-background2); --file-hover-color-3: var(--b3-font-background3); --file-hover-color-4: var(--b3-font-background4); /* 文档打开颜色 */ --file-open-color-1: var(--b3-font-background1); --file-open-color-2: var(--b3-font-background2); --file-open-color-3: var(--b3-font-background3); --file-open-color-4: var(--b3-font-background4); } /* 折叠按钮 */ .sy__file>.fn__flex-1>ul li>.b3-list-item__toggle { padding-left: 5px !important; } /* 竖线 */ .sy__file>.fn__flex-1>ul li { margin-bottom: -1px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; } .sy__file>.fn__flex-1>ul li:has(span>svg.b3-list-item__arrow--open) { border-bottom-left-radius: 0px; } .sy__file>.fn__flex-1>ul ul { padding-left: 3px; margin-left: 8px; border-top-left-radius: 0px; border-bottom-left-radius: 10px; } /* 竖线颜色 */ .sy__file>.fn__flex-1>ul li:nth-of-type(4n+1), .sy__file>.fn__flex-1>ul ul:nth-of-type(4n+1) { border-left: 4px solid var(--vertical-line-color-1); } .sy__file>.fn__flex-1>ul li:nth-of-type(4n+2), .sy__file>.fn__flex-1>ul ul:nth-of-type(4n+2) { border-left: 4px solid var(--vertical-line-color-2); } .sy__file>.fn__flex-1>ul li:nth-of-type(4n+3), .sy__file>.fn__flex-1>ul ul:nth-of-type(4n+3) { border-left: 4px solid var(--vertical-line-color-3); } .sy__file>.fn__flex-1>ul li:nth-of-type(4n), .sy__file>.fn__flex-1>ul ul:nth-of-type(4n) { border-left: 4px solid var(--vertical-line-color-4); } /* 文档悬浮颜色 */ .sy__file>.fn__flex-1>ul li:hover:not(.b3-list-item--focus):nth-of-type(4n+1) { background-color: var(--file-hover-color-1) !important; border-bottom-left-radius: 10px !important; } .sy__file>.fn__flex-1>ul>ul li:hover:not(.b3-list-item--focus):nth-of-type(4n+2) { background-color: var(--file-hover-color-2) !important; } .sy__file>.fn__flex-1>ul>ul>ul li:hover:not(.b3-list-item--focus):nth-of-type(4n+3) { background-color: var(--file-hover-color-3) !important; } .sy__file>.fn__flex-1>ul>ul>ul>ul li:hover:not(.b3-list-item--focus):nth-of-type(4n) { background-color: var(--file-hover-color-4) !important; } /* 文档打开颜色 */ .sy__file>.fn__flex-1>ul li.b3-list-item--focus:nth-of-type(4n+1) { background-color: var(--file-open-color-1); } .sy__file>.fn__flex-1>ul>ul li.b3-list-item--focus:nth-of-type(4n+2) { background-color: var(--file-open-color-2); } .sy__file>.fn__flex-1>ul>ul>ul li.b3-list-item--focus:nth-of-type(4n+3) { background-color: var(--file-open-color-3); } .sy__file>.fn__flex-1>ul>ul>ul>ul li.b3-list-item--focus:nth-of-type(4n) { background-color: var(--file-open-color-4); }
请输入回帖内容 ...

推荐标签 标签

  • Hexo

    Hexo 是一款快速、简洁且高效的博客框架,使用 Node.js 编写。

    22 引用 • 148 回帖 • 8 关注
  • Rust

    Rust 是一门赋予每个人构建可靠且高效软件能力的语言。Rust 由 Mozilla 开发,最早发布于 2014 年 9 月。

    59 引用 • 22 回帖 • 7 关注
  • 爬虫

    网络爬虫(Spider、Crawler),是一种按照一定的规则,自动地抓取万维网信息的程序。

    106 引用 • 275 回帖
  • Sublime

    Sublime Text 是一款可以用来写代码、写文章的文本编辑器。支持代码高亮、自动完成,还支持通过插件进行扩展。

    10 引用 • 5 回帖
  • C

    C 语言是一门通用计算机编程语言,应用广泛。C 语言的设计目标是提供一种能以简易的方式编译、处理低级存储器、产生少量的机器码以及不需要任何运行环境支持便能运行的编程语言。

    86 引用 • 165 回帖
  • MySQL

    MySQL 是一个关系型数据库管理系统,由瑞典 MySQL AB 公司开发,目前属于 Oracle 公司。MySQL 是最流行的关系型数据库管理系统之一。

    694 引用 • 537 回帖
  • Office

    Office 现已更名为 Microsoft 365. Microsoft 365 将高级 Office 应用(如 Word、Excel 和 PowerPoint)与 1 TB 的 OneDrive 云存储空间、高级安全性等结合在一起,可帮助你在任何设备上完成操作。

    5 引用 • 34 回帖
  • NetBeans

    NetBeans 是一个始于 1997 年的 Xelfi 计划,本身是捷克布拉格查理大学的数学及物理学院的学生计划。此计划延伸而成立了一家公司进而发展这个商用版本的 NetBeans IDE,直到 1999 年 Sun 买下此公司。Sun 于次年(2000 年)六月将 NetBeans IDE 开源,直到现在 NetBeans 的社群依然持续增长。

    78 引用 • 102 回帖 • 712 关注
  • 面试

    面试造航母,上班拧螺丝。多面试,少加班。

    326 引用 • 1395 回帖
  • Pipe

    Pipe 是一款小而美的开源博客平台。Pipe 有着非常活跃的社区,可将文章作为帖子推送到社区,来自社区的回帖将作为博客评论进行联动(具体细节请浏览 B3log 构思 - 分布式社区网络)。

    这是一种全新的网络社区体验,让热爱记录和分享的你不再感到孤单!

    134 引用 • 1127 回帖 • 108 关注
  • IPFS

    IPFS(InterPlanetary File System,星际文件系统)是永久的、去中心化保存和共享文件的方法,这是一种内容可寻址、版本化、点对点超媒体的分布式协议。请浏览 IPFS 入门笔记了解更多细节。

    20 引用 • 245 回帖 • 232 关注
  • 微信

    腾讯公司 2011 年 1 月 21 日推出的一款手机通讯软件。用户可以通过摇一摇、搜索号码、扫描二维码等添加好友和关注公众平台,同时可以将自己看到的精彩内容分享到微信朋友圈。

    133 引用 • 796 回帖
  • Facebook

    Facebook 是一个联系朋友的社交工具。大家可以通过它和朋友、同事、同学以及周围的人保持互动交流,分享无限上传的图片,发布链接和视频,更可以增进对朋友的了解。

    4 引用 • 15 回帖 • 443 关注
  • Spring

    Spring 是一个开源框架,是于 2003 年兴起的一个轻量级的 Java 开发框架,由 Rod Johnson 在其著作《Expert One-On-One J2EE Development and Design》中阐述的部分理念和原型衍生而来。它是为了解决企业应用开发的复杂性而创建的。框架的主要优势之一就是其分层架构,分层架构允许使用者选择使用哪一个组件,同时为 JavaEE 应用程序开发提供集成的框架。

    947 引用 • 1460 回帖 • 1 关注
  • V2EX

    V2EX 是创意工作者们的社区。这里目前汇聚了超过 400,000 名主要来自互联网行业、游戏行业和媒体行业的创意工作者。V2EX 希望能够成为创意工作者们的生活和事业的一部分。

    16 引用 • 236 回帖 • 242 关注
  • ZooKeeper

    ZooKeeper 是一个分布式的,开放源码的分布式应用程序协调服务,是 Google 的 Chubby 一个开源的实现,是 Hadoop 和 HBase 的重要组件。它是一个为分布式应用提供一致性服务的软件,提供的功能包括:配置维护、域名服务、分布式同步、组服务等。

    61 引用 • 29 回帖 • 12 关注
  • OAuth

    OAuth 协议为用户资源的授权提供了一个安全的、开放而又简易的标准。与以往的授权方式不同之处是 oAuth 的授权不会使第三方触及到用户的帐号信息(如用户名与密码),即第三方无需使用用户的用户名与密码就可以申请获得该用户资源的授权,因此 oAuth 是安全的。oAuth 是 Open Authorization 的简写。

    36 引用 • 103 回帖 • 36 关注
  • 深度学习

    深度学习(Deep Learning)是机器学习的分支,是一种试图使用包含复杂结构或由多重非线性变换构成的多个处理层对数据进行高层抽象的算法。

    43 引用 • 44 回帖 • 2 关注
  • Thymeleaf

    Thymeleaf 是一款用于渲染 XML/XHTML/HTML5 内容的模板引擎。类似 Velocity、 FreeMarker 等,它也可以轻易的与 Spring 等 Web 框架进行集成作为 Web 应用的模板引擎。与其它模板引擎相比,Thymeleaf 最大的特点是能够直接在浏览器中打开并正确显示模板页面,而不需要启动整个 Web 应用。

    11 引用 • 19 回帖 • 394 关注
  • Swift

    Swift 是苹果于 2014 年 WWDC(苹果开发者大会)发布的开发语言,可与 Objective-C 共同运行于 Mac OS 和 iOS 平台,用于搭建基于苹果平台的应用程序。

    34 引用 • 37 回帖 • 559 关注
  • PWL

    组织简介

    用爱发电 (Programming With Love) 是一个以开源精神为核心的民间开源爱好者技术组织,“用爱发电”象征开源与贡献精神,加入组织,代表你将遵守组织的“个人开源爱好者”的各项条款。申请加入:用爱发电组织邀请帖
    用爱发电组织官网:https://programmingwithlove.stackoverflow.wiki/

    用爱发电组织的核心驱动力:

    • 遵守开源守则,体现开源&贡献精神:以分享为目的,拒绝非法牟利。
    • 自我保护:使用适当的 License 保护自己的原创作品。
    • 尊重他人:不以各种理由、各种漏洞进行未经允许的抄袭、散播、洩露;以礼相待,尊重所有对社区做出贡献的开发者;通过他人的分享习得知识,要留下足迹,表示感谢。
    • 热爱编程、热爱学习:加入组织,热爱编程是首当其要的。我们欢迎热爱讨论、分享、提问的朋友,也同样欢迎默默成就的朋友。
    • 倾听:正确并恳切对待、处理问题与建议,及时修复开源项目的 Bug ,及时与反馈者沟通。不抬杠、不无视、不辱骂。
    • 平视:不诋毁、轻视、嘲讽其他开发者,主动提出建议、施以帮助,以和谐为本。只要他人肯努力,你也可能会被昔日小看的人所超越,所以请保持谦虚。
    • 乐观且活跃:你的努力决定了你的高度。不要放弃,多年后回头俯瞰,才会发现自己已经成就往日所仰望的水平。积极地将项目开源,帮助他人学习、改进,自己也会获得相应的提升、成就与成就感。
    1 引用 • 487 回帖 • 4 关注
  • CSDN

    CSDN (Chinese Software Developer Network) 创立于 1999 年,是中国的 IT 社区和服务平台,为中国的软件开发者和 IT 从业者提供知识传播、职业发展、软件开发等全生命周期服务,满足他们在职业发展中学习及共享知识和信息、建立职业发展社交圈、通过软件开发实现技术商业化等刚性需求。

    14 引用 • 155 回帖
  • CongSec

    本标签主要用于分享网络空间安全专业的学习笔记

    1 引用 • 1 回帖 • 37 关注
  • 开源中国

    开源中国是目前中国最大的开源技术社区。传播开源的理念,推广开源项目,为 IT 开发者提供了一个发现、使用、并交流开源技术的平台。目前开源中国社区已收录超过两万款开源软件。

    7 引用 • 86 回帖
  • ngrok

    ngrok 是一个反向代理,通过在公共的端点和本地运行的 Web 服务器之间建立一个安全的通道。

    7 引用 • 63 回帖 • 655 关注
  • Kafka

    Kafka 是一种高吞吐量的分布式发布订阅消息系统,它可以处理消费者规模的网站中的所有动作流数据。 这种动作(网页浏览,搜索和其他用户的行动)是现代系统中许多功能的基础。 这些数据通常是由于吞吐量的要求而通过处理日志和日志聚合来解决。

    36 引用 • 35 回帖 • 3 关注
  • SOHO

    为成为自由职业者在家办公而努力吧!

    7 引用 • 55 回帖 • 3 关注