软件使用心得_2

最新推荐文章于 2022-03-02 19:19:15 发布

路过的大明

最新推荐文章于 2022-03-02 19:19:15 发布

阅读量136

点赞数

分类专栏：软件推荐及使用

本文链接：https://blog.csdn.net/weixin_44145564/article/details/107516677

版权

软件推荐及使用专栏收录该内容

3 篇文章 0 订阅

订阅专栏

自己制作一个浏览器书签

效果图

先上图，我觉得最大的优点就是可自定义编辑、浏览器兼容、方便分享~~和高(zhuang)端(B)~~ 。
在这里插入图片描述
我把这个网址固定在浏览器了；
点击导航栏的文字可以跳到对应的分类；
点击地址栏打开对应的页面，也可以把链接做到名称上面；
界面颜色，文字样式都是能自定义修改的。
扩展性极强，可通过代码自定义编辑界面样式(加图片什么的都是可以的)。

————————————————————分割线——————————————————————

背景

浏览器书签是下图这种，这也没什么，整理好之后很方便的，支持搜索书签功能。而且如果有登录浏览器的话，书签备份、导出、导入也很方便。
在这里插入图片描述

有一次看到个程序员的书签，他是放在网页上的，打开一个网页，然后从里面找，瞬间让我心动了，高端，秀啊！
然后，有着半吊子编程经验的我就动手了，我也没有搜过网上其他人的，毕竟这个做起来不算难。
我已知的有两种方法：

网页原型软件Axure：简单易上手，可视化，画完后直接导出,(对，就是画)，但是要下载软件，而且导出的是文件夹(因为有一大堆东西)。这个软件其实不需要安装的，直接把别人电脑里整个Axure软件的文件夹拷贝出来就能用(需要重新激活)。
直接用html语言编写：无软件限制，有电脑就行，可操作性性强，最简洁的情况只需要一个文本文档就行(只占用几十kb的容量)，但需要学习语言.

我选择的后者，编写书签，纯文本的东西，对html语言的运用要求不高，我画了1h左右就上手写出了书签的代码。
从哪里学的呢？这里：菜鸟教程：https://www.runoob.com/html/html-tutorial.html，提供在线编程。
有解释有例子，对小白很友好，上手快。

举个例子

例子效果：
在这里插入图片描述
例子代码：
代码我就不解释了，结合代码看前面说的教程，上手更快。如果有一丢丢编程经验，是可以直接看代码扩展书签的。

<!--这是收藏的网址文件夹-->
<!DOCTYPE html>
<html>
<head>	<!--网页名称-->
<meta charset="utf-8">
<title>收藏</title> 
</head>
<body style="background-color:black;"> <!--改变背景颜色-->

<h2 style="color:white">王小明的收藏网址
<em style="color:rgb(100, 100, 100);font-size:15px;">存放于文件夹“******”</em> </h2><!--收藏夹文件储存的位置-->

<table><!--导航栏-->
<tr style="color:rgb(77, 148, 255);font-size:18px;"> 
  <th> 导航栏： </th> 
  <th> <a href="#QKLW">		分类一		</a> </th>
  <th> <a href="#CJGJ">		分类二		</a> </th>
  <!--此处添加新导航-->
</tr>
</table> 

<hr/> <table cellpadding="2"> <!--表格代码开始-->
 <caption style="color:rgb(77, 148, 255);font-size:20px;text-align:left;"> <a id="CJGJ">分类一</a> </caption> <!--表标题-->
<tr style="text-align:left;color:rgb(90, 90, 90);font-size:18px;"> <!--表头-->
  <th >名称</th> <th>地址</th> <th>关键词</th> <th>备注</th>
</tr>
<tr style="color:rgb(200, 200, 200);font-size:15px;;font-size:15px;">
  <td >中国知网   </td> 
  <td><a href="http://www.cnki.net/" style="text-decoration:none;" target="_blank">www.cnki.net</a></td> 
  <td>……略</td>
</tr>
<tr style="color:rgb(200, 200, 200);font-size:15px;;font-size:15px;">
  <td >百度翻译    </td> 
  <td><a href="https://fanyi.baidu.com" style="text-decoration:none;" target="_blank">单击跳转</a></td> 
  <td>关键<!--此处输入关键词-->词</td>
  <td>标<!--此处输入标记-->记</td>
</tr>
</table> 

<hr/> <table cellpadding="2"> <!--表格代码开始-->
 <caption style="color:rgb(77, 148, 255);font-size:20px;text-align:left;"> <a id="QKLW">分类二</a> </caption> <!--表标题-->
<tr style="text-align:left;color:rgb(90, 90, 90);font-size:18px">
  <th>名称</th> <th>地址</th> <th>关键词</th> <th>备注</th> <!--表头-->
</tr>
<tr style="color:rgb(200, 200, 200);font-size:15px;;font-size:15px;">
  <td >知网翻译助手    </td> 
  <td><a href="http://dict.cnki.net/" style="text-decoration:none;" target="_blank">单击跳转</a></td> 
  <td>在线 专业术语 翻译</td>
</tr>
</table> 
<hr/> <!--横线-->

傻瓜式操作

快捷键windows+E打开文件管理，如下图把“文件扩展名“勾选上。
任意位置新建一个文本文档，修改后缀名为“html” (也可以先复制代码，再改后缀)。
右键图标，以记事本方式打开文件，将代码复制进去，保存。
以浏览器方式打开(直接双击)，然后将这个页面收藏到浏览器书签，就OK了。

注意：如果修改了html文件的位置，则需要重新收藏书签。
要分享给别人，直接把文件给别人，然后他/她直接打开就好了。

路过的大明

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
软件使用心得_2

自己制作一个浏览器书签先上图，我觉得最大的优点就是可自定义编辑、浏览器兼容、方便分享~~、高(zhuang)端(B)~~ 。我把这个网址固定在浏览器了，点击导航栏的文字可以跳到对应的分类大多数人的浏览器书签是下图这种，这也没什么，整理好之后很方便的。而且如果有登录浏览器的话，书签备份、导出、导入还是很方便的，而且还支持搜索书签功能。有一次看到个程序员的书签，他是放在网页上的，打开一个网页，然后从里面找，瞬间让我心动了，高端，秀啊！然后，有着半吊子编程经验的我就动手了，我也没有搜过网上其他人的
复制链接

扫一扫