html实战之一（利用html+css做一个静态页面）

参照一般博客的样子，做了个超简易版，先秀一下样子

html1

很明显主体部分是三个模块，顶部左侧和右侧div

写的过程中客服的几个问题：

1.参照了w3school的样子，固定主体宽度，调整浏览器时，保持最小宽度
html {
   width: 966px;
   background-color: #f9f9f9;
   margin: 0px auto;    //整体居中
  /* overflow: scroll;
   overflow-x: hidden;*/
  
}

2.顶部图片是个链接，并且撑到了最大

 

3.左侧div的'我的分类'下部分是一个ul，这里css也调了好久，才打到w3school的类似对齐效果。做以下几个工作：

  

我的分类

• 文章

               
• 图片浏览


• 分类3


• 分类4


• 分类5


• 分类6


• 分类7


• 分类8


• 分类9

//样式

去边距空格，不懂得可以打开chrome浏览器的开发者工具，看看右下角的这个图

*
{
margin:0;
padding:0;
border:0;
}

ul去掉点 

li链接项设置样式  a:link代表未访问过链接   a:visited代表访问过的链接

a:link,a:visited {
    text-decoration: none;   //无装饰
    color: #000;
  background: transparent;
    } 




设置行高字体等

li{

font-family: Verdana, Arial, '宋体';
line-height: 21px;
font-size: 15px;
margin: 0;
padding: 0;
text-align: left;
}





4.正文部分不说了，就是左侧和右侧要设定宽，然后要在同一层，设置float得一起，不然可能很奇怪