div中LI超出宽度换行虽然是个小问题，也是老生常谈，但还是会经常遇到，这里整理出来以备查阅：
CSS样式部分：
1
2
3
4
5
6
7
8
9
10
11
| div{
width:200px;
overflow:hidden;
white-space:nowrap; /*强制内容不折行显示*/
border:#333 1px solid;
}
div ul li{
display:inline-block;/*Firefox3 beta、IE8 beta、Opera、Safari 支持*/
display:-moz-inline-stack;/* Firefox 的私有属性，也可以用 -moz-inline-box */
*display:inline;/*一旦IE 下触发了 hasLayout，设置 block 元素为 inline 会使 display:inline 效果与 display:inline-block 相似*/
} |
HTML代码部分：
1
2
3
4
5
6
7
8
9
10
11
| <div>
<ul>
<li>传说中的测试文字</li>
<li>传说中的测试文字</li>
<li>传说中的测试文字</li>
<li>传说中的测试文字</li>
<li>传说中的测试文字</li>
<li>传说中的测试文字</li>
<li>传说中的测试文字</li>
</ul>
</div> |
预览效果自己测试去吧
在做网站时会遇到很多的问题，所以网页设计师通常要扮演多种角色，并且要掌握如何构建一个有效实用的网站布局知识。
你在网页设计所学到的大多数教训都来自工作经验。学习是一个反复持续的过程，并且没有比犯错更好的方式来获得知识（从错误中学习）。在本文中，我们将讨论10个重要并常规的技巧，这是每位网页设计师新手都应该知道。
1. 优化图片，获得更好的页面加载速度
学习如何通过选择正确的格式，来优化网页图片，并确保文件大小在可行的范围你是足够小的。虽然现在人们已经都在使用宽带，但仍然有人是拨号上网。此 外，虽然移动装置技术的普及，但移动装置却不一定支持像宽频一样的速度，图片文件的大小可能还是会延长网页的加载时间，有可能把用户赶走的。
这里有个选择适合的文件格式的技巧：如果图片是单色，那最好保存成PNG或者GIF格式；如果是连续性的色调（如照片）则最好保存成 JPG格式。
有很多的工具可以帮助你进一步优化你的图片，降低他们的文件大小。可以参考这个工具列表来帮助优化你的图片。尽量把图片数量减到最低，并且灵活使用图片，并且尽可能地减小文件大小。如此一来，将可以大大的减少页面的读取时间和改善网页的性能。 继续阅读 »
收集到一个非常不错的图片DIV无缝滚动代码，这里整理出来分享一下：有向上滚动，向左滚动和上下左右滚动。
Div+CSS无缝滚动完美解决方案：向上滚动
向上无缝滚动头部代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
| <!--//向上滚动代码开始-->
<style type="text/css">
body{margin:0px auto; padding:0px;}
ul,li{margin:0px; padding:0px;list-style:none;}
.sqBorder {width:122px; height:182px; padding:10px; border:1px #000000 solid; background:#555555;}
.scroll_div {width:122px; height:180px; margin:0 auto; overflow: hidden; white-space: nowrap; background:#ffffff;}
.scroll_div img {width:120px;height:60px;border:0;margin: 8px auto; border:1px #efefef solid;}
</style>
<script language="javascript">
function ScrollImgTop(){
var speed=20
var scroll_begin = document.getElementById("scroll_begin");
var scroll_end = document.getElementById("scroll_end");
var scroll_div = document.getElementById("scroll_div");
scroll_end.innerHTML=scroll_begin.innerHTML
function Marquee(){
if(scroll_end.offsetTop-scroll_div.scrollTop< =0)
scroll_div.scrollTop-=scroll_begin.offsetHeight
else
scroll_div.scrollTop++
}
var MyMar=setInterval(Marquee,speed)
scroll_div.onmouseover=function() {clearInterval(MyMar)}
scroll_div.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
}
</script>
</script> |
继续阅读 »
对于锚文本一直都比较顾虑，虽然在实践中也一直用到，但对具体操作方式没有深入了解，今天看到深圳SEO的曾文先生发表一篇博文《网站优化锚文本链接之精髓》，对锚文本解读的非常到位详细，这里转载过来和大家分享。
锚文本总体来分可以分为外部与内部锚文本链接，网站中的关键词并不能完全代表该网站主体排名因素，起决定因素的还是其他网站或者网页给予您的网站的认知程度。因此在其他网站或网页的锚文本出现关键词链接才是最重要的。
•内部锚文本链接是为了提高用户体验和增强文章粘性，达到提升流量的目的。当文章里出现相关性内容又有利于用户体验，就可以给相关性加上锚文本。这样有利于搜索引擎的抓取。当谈到相关问题时，添加相关页面的锚文本，将有助于搜索引擎对这些相关页面的抓取和搜录。有利于页面关键词的排名。
•外部链接锚文本主要是建立网站的反向链接，反向链接是影响排名的重要因素，反向链接不仅仅是指网站外部的链接，也包括网站内部的链接，都会影响到排名。当页面中出现某个相关页面的关键词的时候，加上锚文本，将助于相关页面关键词排名的提高。有利于首页的权重提高。每个内页都应该有锚文本指向首页，让整个网站的权重集中到首页上，随着首页权重的提高，也能以锚文本为纽带，带动内页的排名。 继续阅读 »