做一个自己的“收藏夹”
本帖最后由 马黑黑 于 2022-3-29 07:26 编辑 <br /><br /><style type="text/css">.txtBox { font:normal 16px/20px serif; }
.txtBox p {padding: 8px 0;}
.codeBox { margin: auto; padding: 12px 10px; max-width: 760px; box-shadow: 1px 1px 2px #ccc; border-radius: 4px; background: rgba(255, 255, 255, .7); }
.codeBox pre { font: 14px Sans-serif; color: #000; }
</style>
<div class="txtBox">
<p>论坛里精彩的帖子很多，收藏手段便是个问题。建议做个帖子，陆续添加内容，就像文本特效集中营那样。</p>
<p>以下给出代码样式，新建帖子是记得<font color="#ff0000">纯文本+HTML代码</font>模式。你要做的，仅仅是有中意的帖子需要收藏时去修改自己的帖子，按说明添加链接和标题即可，简单得不要不要的：</p>
</div>
<div class="codeBox">
<pre>
<style type=<span style='color: magenta'>"text/css"</span>>
<span style='color: blue;'> #linkBox { column-count</span>: 3; column-gap: 10px; }
<span style='color: blue;'> #linkBox a{ text-decoration</span>: none; }
<span style='color: blue;'> #linkBox a</span>:hover{ color: red; }
</style>
<<span style='color:darkred'>div</span> <span style='color: red'>id</span><span style='color: blue'>=</span><span style='color: magenta'>"linkBox"</span>><<span style='color: darkred'>/div</span>>
<script language=<span style="color: magenta">"javascript"</span>><span style="color: green">
/*按下面格式添加链接与标题
注意，最后一行不能有小角逗号
其他每行都要有小角逗号收尾
*/
</span>var hrefAr = [
[<span style="color: magenta">'链接一'</span>, <span style="color: magenta">'标题一'</span>],
[<span style="color: magenta">'链接二'</span>, <span style="color: magenta">'标题二'</span>],
[<span style="color: magenta">'链接三'</span>, <span style="color: magenta">'标题三'</span>],
[<span style="color: magenta">'链接四'</span>, <span style="color: magenta">'标题四'</span>]
];
<span style="color: blue">var</span> str = <span style="color: magenta">''</span>;
<span style="color: blue">for</span>(x <span style="color: blue">in</span> hrefAr) {
str += `${parseInt(x)+1}. <a href=<span style="color: magenta">'${hrefAr}'</span>>${hrefAr}</a><br>`;
}
<span style="color: red">document</span>.getElementById(<span style="color: magenta">"linkBox"</span>).innerHTML = str;
</script>
</pre>
</div>
这样就很方便查看了。谢谢老黑，方法真多。{:4_199:} 加林森 发表于 2022-3-29 11:19
这样就很方便查看了。谢谢老黑，方法真多。
方法是人想出来的 <style type="text/css">
#linkBox { column-count: 3; column-gap: 10px; }
#linkBox a{ text-decoration: none; }
#linkBox a:hover{ color: red; }
</style>
<div id="linkBox"></div>
<script language="javascript">
/*按下面格式添加链接与标题
注意，最后一行不能有小角逗号
其他每行都要有小角逗号收尾
*/
var hrefAr = [
['https://www.huachaowang.com/forum.php?mod=viewthread&tid=58210', '送把刀给东篱玩玩'],
['https://www.huachaowang.com/forum.php?mod=viewthread&tid=58205', '想了想摘两片树叶送给粥粥'],
['https://www.huachaowang.com/forum.php?mod=viewthread&tid=58179', '十种赏心悦目的颜色'],
['https://www.huachaowang.com/forum.php?mod=viewthread&tid=58120', '大水珠'],
['https://www.huachaowang.com/forum.php?mod=viewthread&tid=58107', '父元素自适应子元素高宽尺寸'],
['https://www.huachaowang.com/forum.php?mod=viewthread&tid=58053', '背景与时钟的关系：为什么']
];
var str = '';
for(x in hrefAr) {
str += `${parseInt(x)+1}. <a href='${hrefAr}'>${hrefAr}</a><br>`;
}
document.getElementById("linkBox").innerHTML = str;
</script> 有意思，点上去就直接跳转到所在帖子去了{:4_187:} 马黑黑 发表于 2022-3-29 11:54
方法是人想出来的
嗯嗯，挺方便了。 加林森 发表于 2022-3-29 11:58
嗯嗯，挺方便了。
{:4_190:} 红影 发表于 2022-3-29 11:58
有意思，点上去就直接跳转到所在帖子去了
做了么 马黑黑 发表于 2022-3-29 12:18
我正在用这个收藏夹呢，搬家开始。{:5_108:} 加林森 发表于 2022-3-29 12:22
我正在用这个收藏夹呢，搬家开始。
不急慢慢来{:4_170:} 马黑黑 发表于 2022-3-29 12:24
不急慢慢来
肯定的，一下是搬不完的。{:5_116:} 马黑黑 发表于 2022-3-29 12:18
做了么
用你的帖子试了试，挺好用的。我还没做呢，空了做一个{:4_204:} 红影 发表于 2022-3-29 19:40
用你的帖子试了试，挺好用的。我还没做呢，空了做一个
嗯嗯，如果需要做的更漂亮，那还得花点心思哦。我只提供核心的。 马黑黑 发表于 2022-3-29 20:51
嗯嗯，如果需要做的更漂亮，那还得花点心思哦。我只提供核心的。
这个已经很好了，非常实用{:4_187:} 红影 发表于 2022-3-29 23:02
这个已经很好了，非常实用
外观没有什么修饰 马黑黑 发表于 2022-3-29 23:03
外观没有什么修饰
实用为上，其他的都可以忽略的{:4_187:} 红影 发表于 2022-3-30 09:38
实用为上，其他的都可以忽略的
要求不高 马黑黑 发表于 2022-3-30 12:12
要求不高
一直都不高{:4_173:} 红影 发表于 2022-3-30 16:39
一直都不高
挺好的 马黑黑 发表于 2022-3-30 18:21
挺好的
是啊，随意自在{:4_204:}