ShakeProof

「2012-12-31」CSS Positioning, Stoke & Monda fonts from Google web fonts

继昨天的「模版更换」与一定配置之后,今天又做了一些调整。简单来讲就是 CSS Positioning 和使用了一款 Google web fonts(Monda)。

CSS Positioning 的问题,背景是如何在高分辨率的屏幕上,较好的显示。最后的解决方案是,整个页面的 positioning 采取 relative (position property from CSS) div 下嵌套 absolute position div 的做法。参考链接1来自 stackoverflow 的一个提问,链接2是《Learn CSS Positioning in Ten Steps》。以左右居中为例,如下所示。

#cnblogs_jtuki_header {
	position: relative;
	left: 50%;
	width: 1150px;
	margin-left: -580px;
}

#leftmenu {
	position: absolute;
	left: 10px;
	width: 220px;
}

#main {
	position: absolute;
	margin-left: 300px;
	width: 850px;
}

另外,就是对字体又做了一点微调,加入了昨天提到的 Monda 字体,在系统里没有 Palatino Linotype 或者其他 Palatino family 字体时(一般如果安装了微软的 Office 2007 或更高版本,系统里就会有类似字体),就采用 Monda 字体。

具体效果参考下面这段话:
This is a sentence with the appearance of Monda font, pretty cool, right?

如果是合适的浏览器,合适的设置,比如搜狗浏览器的高速模式(而不是兼容模式),就会看到类似下图的显示。(关键是支持 Web Open Font Format 开放字体格式)

image 

Stoke 同样是一款很酷的字体,可惜字号偏大,如果单纯用来做博客的标题,倒是蛮不错的,虽然大字号情况下 Times New Roman 也看起来很不错了。当然,如果不考虑网速问题,Stoke,你值得拥有。

另外,据说微软内部还有负责「干掉 IE6」的人,国内的各种「高速浏览器」,在这方面应该都是立功的。

image

posted on 2012-12-31 16:38  mirrorwheel  阅读(231)  评论(0编辑  收藏  举报

导航