标签为 CSS 的存档

十一日记

明明感觉身边的人已经没有几个再去挤占黄金周的宝贵时期,但在车站里却依旧人如潮涌,一票难求,愈发拥挤!回家的迫切之情未能抵挡住人潮的奔涌,只好是延期一天才回到了老家。

老家自打八月十五以来的日子每天都在下雨,这对正在秋收的季节来说不是个好现象。回去的第二天,天气有了一点点的好转,于是我们利用了这仅有的一点点时间把地里的玉米抢了回来。没有多久,小雨就又开始了冲刷大地的举动。余下的时间百无聊赖,唯一可做的就是在屋里睡大觉,这几天算是把战用的休息时间补回来不少。

时间空闲了,思想便慢慢长出了翅膀,四处神游去了.

吃一堑、长一智,古语是不容置疑的。提前一天回来车上还那么多的人,害让我又在汽车上站了近两个小时。进家门,冲澡,洗漱,开电脑,一切都在按我的计划进行,终于要开始一次大的行动了。

因为对新的web标准没有接触过,div+css的方式真是不如table来的习惯,开始的进度十分缓慢,一切全是摸索着来,照葫芦画瓢,不停的在试验、修改、学习、技巧中反复进行.不知不觉中,时间飞逝,接连两个晚上只睡了八个小时,不知是睡眼不足或是身体状态出现问题,开始出现失眠现象,时不时的出现头晕现象,有点像血压低的症况!看来要好好休息下了.

Mozilla官方建议的CSS书写顺序

因为自己一直在用firefox的浏览器,而且又正在进行商城的模板制作,大部分东西都是从头开始学的,对于对代码标准控制非常严格的firefox来说,这个技巧真的很重要,掌握这个书写顺序将对网页布局有很大帮助,经过firefox下的检验,一般在IE下也就没什么问题了。贴来分享下,仅供大家参考:

显示属性
display
list-style
position
float
clear

自身属性
width
height
margin
padding
border
background

文本属性
color
font
text-decoration
text-align
vertical-align
white-space
other text
content

搜索引擎的增强

又偷了一段代码,原理在这里,只是如果想应用在自己的搜索引擎里可能还要做相应的修改才行.

(function() { var f = document.getElementById(‘searchbox’); if (!f) { f = document.getElementById(‘searchbox_demo’); } if (f && f.q) { var q = f.q; var n = navigator; var l = location; if (n.platform == ‘Win32′) { q.style.cssText = ‘border: 1px solid #7e9db9; padding: 2px;’; } var b = function() { if (q.value == ”) { q.style.background = ‘#FFFFFF url(http://www.google.com/coop/images/google_custom_search_watermark.gif) left no-repeat’; } }; var f = function() { q.style.background = ‘#ffffff’; }; q.onfocus = f; q.onblur = b; if (!/[&?]q=[^&]/.test(l.search)) { b(); } } })();

今天抽时间测试了下,发现在IE下显示正常但在FF下则不能正常显示,不知道是代码的问题,还是兼容性的问题,或者偷来的代码不全.无奈之下,暂时放下不用了.等以后有时间再研究吧.

LBS修改-随机日志出现的问题

昨天开始试用“生活笔谈”的随机日志功能,修改改好程序后,发现有点小问题,在FF里浏览网页没有问题,但用IE在查看时发现有些日志里一部分和随机日志模块平行的外围容器中文字不见了!真是郁闷呀,在他那里没有找到相关的问题说明,没有办法自己解决吧。

问题还是出在了CSS上面,举个例子会很明白:
css :

body { margin: 10px 50px;}
#contener { border: 1px solid #000; background-color: yellow;}
#floatRight { float: right; border: 1px solid red; color: red; width: 30%;}
#contenu { border: 1px solid blue; color: blue;}
.spacer { clear: both; border: 1px solid #FF00FF; color: #FF00FF;}

xhtml :

<div id=”contener”>
<b>#contener</b>
<div id=”floatRight”>
<b>#floatRight</b> : Float block at the right of the block #contenu
</div>
<div id=”contenu”>
<b>#contenu</b> : Simple block
</div>
<div class=’spacer’>
<b>.spacer</b> : a “spacer” block…
</div>
</div>

正确应该显示为:
http://www.jluvip.com/blog/uploads/200606/08_181038_ok2.png

Internet Explorer 6 显示为 :
http://www.jluvip.com/blog/uploads/200606/08_181047_ie_bug2.png

#contener 层的文字和#contenu层不见了! 只有#contener的背景颜色!

解决办法 :

body { margin: 10px 50px;}
#contener {
position: relative; /* 增加的 */
border: 1px solid #000;
background-color: yellow;
}
#floatRight {
position: relative; /* 增加的*/
float: right;
border: 1px solid red;
color: red;
width: 30%;
}