寻找并删除Git记录中的大文件

Shell Git Github awk grep

最近发现HarttleLand的Git仓库已经达到了142M,严重影响Fork和Clone。 今晨Harttle从Git记录中定位了数百个大文件并将其删除,现在仓库恢复了27M的大小。 借此机会,本文来介绍查找和重写Git记录的命令:git rev-list, git filter-branch。 本文用于学习用途,生产环境请考虑使用 bfg 等效率工具(感谢 oott123 的评论)。

CSS 控制表格样式

CSS Chrome HTML 伪类 选择符

表格是HTML中用来显示比较密集的信息,在HTML早期就有支持。 表格的HTML标记较其他元素复杂很多,浏览器也为<table>标签提供了不少默认样式, 所以表格的排版行为也较为复杂。 本文讨论了表格的边框模型,以及如何利用CSS3设置条纹样式和视觉反馈。

CSS3 实现导航栏

CSS HTML float inline inline-block 搜索引擎

导航栏是Web中常用的UI组件,在Bootstrap等CSS框架中基本都会提供。 既然导航栏这么重要,下面我们便来手动实现一个导航栏。 这个过程还是需要掌握一些排版技巧和CSS3特性的。

列表样式

导航栏通常使用<ul>来标记:

<ul>
  <li><a>First Item</a></li>
  <li><a>Second Item</a></li>
  <li class="active"><a>Third Item</a></li>
  <li><a>Fourth Item</a></li>
</ul>

首先便要去掉列表的那些默认样式,比如左边的项目标记(小圆点)和边距:

ul {
  left-margin: 0;         /* IE/Opera 默认使用外边距 */
  left-padding: 0;        /* Safari/Firefox 默认使用内边距 */
  list-style-type: none;  /* 左侧项目标记 */
}

这样便去掉了浏览器给<ul>设置的默认样式了。 至于如何自定义左侧的项目标记,可参考那些 CSS 背景图的技巧一文。

玩转超链接的样式

CSS HTML inline-block white-space 伪类 字体 盒模型 选择符

超链接虽然不起眼,但它却是万维网(Web)的基石,它使得用户可以在整个万维网进行导航。 链接的默认样式却很低调,在富有设计感的网站中通常会重写链接的样式。 下文介绍常用的一些链接样式技巧:链接状态选择符、自定义下划线、设置外链样式、按钮的实现等。

链接状态选择符

超链接标签有很多状态:未访问、已访问、悬停、激活。这些都可以通过CSS伪类选择符来识别。 其中悬停和激活是一般HTML元素都具有的状态,对于链接而言,当鼠标悬停时:hover生效, 点击后:active生效。比如我们设置未访问的链接呈蓝色,已访问的链接呈绿色:

a:link {color: blue;}
a:visited {color: green;}
a:hover, a:active {color: red;}

那些 CSS 背景图的技巧

CSS HTML float 搜索引擎

HTML的精髓在于文本的、结构化的数据格式。 这样的设计使得搜索引擎、屏幕阅读器、文本处理软件能够非常方便地读取信息。 尤其是CSS样式的分离与HTML5语义标签的提出,使得HTML的这一特性更加明显。 然而对于Web设计师,他们需要除文本外更加丰富的表示形式。 幸运的是CSS的分离,使得我们在不添加标记的同时,可以在页面上显示图片。 下面来看看这些有用的CSS背景图技术。

PKU 网关 Chrome 插件 PKUWebmaster 升级到 2.0 啦!

Chrome Github HTML JavaScript PKU

早在2013年,为了方便PKU的Chrome用户连接校内网官,包括Rea和我在内的鸟人团队一起编写了PKUWebmaster。 此后该插件历经了Chrome Notification 的标准化、PKU 网关接口的变化、以及整个Web前端技术的革新, 鸟人团队于近期意识到更新该插件的必要性。现已修复了既有BUG,并重写了设置页面。

安装与使用

2.0版本已经更新在Chrome商店了:

https://chrome.google.com/webstore/detail/pkuwebmaster(北京大学网关插件)/bnlipdfmheddpljigcaaamjpnbhhklkb

如果你希望使用最新的版本,可以下载Github仓库:

https://github.com/pku-birdmen/pkuwebmaster

并将src目录拖动至Chrome的『扩展程序』页面即可。

上一页 下一页