编辑HTML代码,批量制作博文清单

简介: 当积累的博文多了,常想制作一个分类目录,方便读者阅读。这可以是一个不轻松且枯燥的工作。  以《关于“IT学子成长指导”专栏及文章目录》中目录的制作为例,介绍我的“懒”办法。这个目录常更新,是件事儿。或许算个技巧,背后,全是重复工作过的辛酸。所谓技巧,全是从笨办法中来的。  博文清单制作方法  我要收录到目录中的文章,皆来自于《IT学子成长指导》博客专栏。进入专栏,改到“管理专栏”的页面。选
当积累的博文多了,常想制作一个分类目录,方便读者阅读。这可以是一个不轻松且枯燥的工作。

  以《关于“IT学子成长指导”专栏及文章目录》中目录的制作为例,介绍我的“懒”办法。这个目录常更新,是件事儿。或许算个技巧,背后,全是重复工作过的辛酸。所谓技巧,全是从笨办法中来的。


  博文清单制作方法

  我要收录到目录中的文章,皆来自于 《IT学子成长指导》博客专栏。进入专栏,改到“管理专栏”的页面。选中要进入专栏的文章,CTRL-C复制了事。(如果博文不是出自专栏,在博客首页选“目录”视图也一样。)如图1:


  到CSDN博客,“写新文章”,CTRL-V,带链接的文章清单复制进去了。还有其他文章,再来几次。可能版面在缩进等方面会出现不如意的情况,不必管,后面处理。如图2:


  点“《》”图标,进入源代码视图,要用的就是这些文章的HTML代码。CTRL-A,CTRL-C。如图3:


  启动EditPlus(或其他HTML编辑器,甚至就Word、WPS),新建一个HTML文档,CTRL-V。如图4:


  接下来,用EditPlus编辑HTML。为使将来格式统一,只保留每个<a>标记中最基本的成分(<a href=”...”>文字</a>),去掉所有的修饰。
  编辑时,不要用眼和手组合做。用编辑器的替换功能。
  选一块,CTRL-C,CTRL-V到“查找”框中,“替换”为的部分,空着就行。点“全部替换”,很爽的感觉。如图5:


  这些标记也就那么几种。几次下来,可能还有个别例外,手工删除。
  文档成了如图6的样子。


  还可以加上你想要的标记。例如,每个链接单独一行排版,将“</a>”替换为“</a><br\>”。如图7:


  将这些代码复制到新写的博文中,切换到“可视化编辑”视图中,你想要的结果就有了。如图8:


  接下来,按你的想法分类、编辑就可以了。


  外一篇:制作带链接的名单

  直接用HTML编辑,是一个很便捷的方式。计算机专业的,知道点HTML,就用好了。
  我的工作中,至少每年都得做一份学生博客链接清单(如 C++程序设计课程主页-2013级中的名单),如法泡制。
  课代表给我提供学生姓名和CSDN博客的用户号,是一个EXCEL文档如图9:


  编辑一下,写成HTML的链接标记。在EXCEL中继续做,是因为EXCEL中的“填充”功能强,写好一行,其他行一拖就成。如图10:


  将表格中的内容,复制、粘贴到word中,仍然是一个表格。将“表格转换为文字”再将所有的制表符“替换”为空,如图11:


  然后,所有的学生链接就有了,如图12。


  根据需要加些换行之类的,大功告成。




=================== 迂者 贺利坚 CSDN博客专栏=================
|== IT学子成长指导专栏 专栏文章的分类目录(不定期更新) ==|
|== C++ 课堂在线专栏  贺利坚课程教学链接(分课程年级) ==|
|== 我写的书——《逆袭大学——传给IT学子的正能量》    ==|
===== 为IT菜鸟起飞铺跑道,和学生一起享受快乐和激情的大学 =====



目录
相关文章
|
2月前
|
编解码 前端开发
编写代码中常见问题汇总(html和css)
编写代码中常见问题汇总(html和css)
31 0
|
2月前
|
前端开发 JavaScript CDN
HTML代码约定
HTML代码约定
30 0
|
28天前
|
编解码 前端开发
编写代码中常见问题汇总(html和css)
text-indent用于首行缩进,line-height与height相同实现垂直居中;vertical-align:middle用于行内元素居中;text-align:center做水平居中;list-style:none清除列表符号;overflow:hidden隐藏溢出;background-repeat:no-repeat阻止平铺;float:left实现横排;相对定位父元素,绝对定位子元素;box-sizing调整盒子模型;用边框或overflow解决盒子塌陷;
37 5
|
1月前
|
前端开发 JavaScript
HTML情人节爱心代码
HTML情人节爱心代码
39 2
|
21天前
|
数据采集 移动开发 前端开发
HTML5 + CSS3 编程规范:构筑清晰、可维护的代码基石
HTML5 + CSS3 编程规范:构筑清晰、可维护的代码基石
|
21天前
HTML中如何插入空格,HTML空格代码,多种HTML空格写法
HTML中如何插入空格,HTML空格代码,多种HTML空格写法
12 0
|
2月前
|
移动开发 前端开发 HTML5
Canvas实现超酷Loading动画HTML代码
之前我们分享过很多基于CSS3的Loading动画效果,相信大家都很喜欢。今天我们要来分享一款基于HTML5 Canvas的发光Loading加载动画特效。Loading旋转图标是在canvas画布上绘制的,整个loading动画是发光3D的视觉效果,HTML5非常强大。
29 1
Canvas实现超酷Loading动画HTML代码
|
1月前
|
前端开发 数据安全/隐私保护
紫色渐变登陆布局html+css代码
这是一段关于网页设计的代码示例,使用纯CSS实现了登录界面的样式。HTML部分包括一个简单的登录表单,包含用户名、密码输入框和登录、注册按钮。CSS部分则定义了各种元素的样式,如背景色、边框、字体颜色等,并使用渐变效果和过渡动画来增强视觉效果。整个设计采用了响应式布局,适应不同设备的屏幕宽度。
28 0