Web开发者的简单颜色指南

我从来不是一个颜色理论的爱好者。我想是因为我对它一直不抱希望。我乐意坐在那儿,色环在手,选取互补色、分散的互补色、三色配色方案,让朋友、家人、客户印象深刻。

说实话,颜色理论对我很遥远,尝试在项目中使用颜色时我从未发现它有用。有点讽刺,我发现,颜色的选择、运用得越好,背后的理论我越有更好的认识。

刚起步时理论并没有真正得帮助,对吧?这就是为什么,在这篇文章里,你不会看到一个单一的色环,相反,我会展示一个简单的你能用在下一个Web项目的颜色工作流。

Read more »

如何使用CSS垂直对齐元素

任何一个Web开发人员都会遇到垂直对齐这个老问题。我在Web领域工作了将近一年,已经被客户问了多次“把这个对齐到窗口中央”或“把那个放到那个的中部”。使用CSS容易实现水平对齐:

对于块级元素(block-level element)

1
display: block; margin: 0 auto;

对于内联元素(inline element,也叫行内元素)

1
display: inline-block; text-align: center;

为什么垂直对齐不能这么简单?问题在于网站传统上并不是为了垂直对齐,网页是横向缩放的,高度改变以适应内容。我们幸运的是CSS有多种方法可以绕过这个问题,有些方法好于其他,有些则是十分糟糕,不应该使用。记住这些都是相对的(有时是绝对的),一个可以在某种情况下解决问题的方法可能不能解决另外一种情况的问题。

Read more »

Hexo + Markdown issues

Backslash escapes

Hexo installs a plugin hexo-renderer-marked as the default Markdown renderer, but the plugin generates literal characters which are not what you want if have a backslash before these characters, such as "scrapy crawl \<spider name\>" becomes "scrapy crawl \". To fix this issue by replacing hexo-renderer-marked with hexo-renderer-markdown-it.

Normally, we insert "<!-- more -->" into a post to display its summary, but don't work if using hexo-renderer-markdown-it with default configuration, hexo-renderer-markdown-it escapes HTML. To fix this issue by appending

1
2
3
markdown:
render:
html: true

to Hexo's _config.yml.

Using multiple spiders in a Scrapy project

Overview

Different channel's structure in a websit are similar, sometimes we want to reuse source code and don't create a Scrap project per channel. This is a tutorial how to use multiple spiders in a Scrapy project.

ENV

Python: 2.7.5
Scrapy: 0.24.2

Tree-like directories of this tutorial project

Source code in GitHub: scrapy_multiple_spiders

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
scrapy_multiple_spiders
├── commands
│   ├── __init__.py
│   └── crawl.py
└── tutorial
├── scrapy.cfg
└── tutorial
├── __init__.py
├── common_spider.py
├── items.py
├── pipelines.py
├── settings.py
├── spider_settings
│   ├── __init__.py
│   ├── spider1.py
│   └── spider2.py
└── spiders
├── __init__.py
├── spider1.py
└── spider2.py
Read more »