Updates from 六月, 2009
-
SEO基础
Jeck
1. about the page title, every page should have a unique title
<head>
<title>Juchy | Web Design, Clothing Design, Make Friends</title>
</head>2. about the description, give a brief overview of the page
<head>
<meta name=”description” content=”clothing and web design, make friends, shopping share, personal favorite website.” />
</head>3. url, meaningful url, include the meaningful word.
4. site map, good and clear structure of the site, put an HTML sitemap page on your site, and use an XML
sitemap file for search engine5. friendly and helpful 404 error page
6. unique, fresh content with relevent language
7. meaningful anchor name
8. Use heading tag appropriately: <h1>,<h2>
9. Optimize the image using, add the “alt”, good image name and
alt and title may helpful for Google image search10. nofollow, setting the value of the “rel” attribute of a link to “nofollow” will tell Google that certain l inks on your site shouldn’t be followed or pass your page’s reputation to the pages linked to. Nofollowing a link is adding rel=”nofollow” inside of the links’s anchor tag. if you want to set all the link on the page to nofollow, set like this:
<head>
<meta name=”robots” content=”nofollow”>
</head> -
HTML基础
Jeck
1. inline 标签的宽高设置
inline属性的标签有<span><a><strong>和<em>,Block标签包括< div><p><h1><form> 和<li>。由于内联标签的inline属性,无法设置高度,宽度,<span><a>< strong>和<em>可以通过加入display:block成为块元素来设置宽度和高度。2. 除水平滚动条
可以在body中插入overflow-x:hidden属性: body {overflow-x: hidden;}3. 在IE6中使用透明PNG图片
IE6的一个很难处理的BUG就是它不支持透明PNG图片,可以用CSS的滤镜来解决这个问题:
*html #image-style {
background-image: none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=”filename.png”, sizingMethod=”scale”);
} -
li 图片垂直居中
Jeck
源自:http://www.planabc.net/2008/05/26/img_vertical_center_solution/
.box {
/*非IE的主流浏览器识别的垂直居中的方法*/
display: table-cell;
vertical-align:middle;/*设置水平居中*/
text-align:center;/* 针对IE的Hack */
*display: block;
*font-size: 175px;/*约为高度的0.873,200*0.873 约为175*/
*font-family:Arial;/*防止非utf-8引起的hack失效问题,如gbk编码*/width:200px;
height:200px;
border: 1px solid #eee;
}
.box img {
/*设置图片垂直居中*/
vertical-align:middle;
}《Vertical Middle》:通过添加一无语义图片来解决图片居中问题,源自韩国Yahoo