就学习两天html和css搭建简易拉勾框架小结

这两天在手中工作已完成,暂时没有新工作安排,所以闲暇时期学习了一下html+css+js的内容,方便熟悉公司项目2.0版本的开发,就这两天学习内容做了一个简易的拉勾小模块搭建工作,说实话,这活做的是真糙,但还是记录一下,能够记录进步吧.

起始,开发工具就是万能的sublime,至于怎么创建项目,起始也很简单啊,看项目想放在什么地方,例如,我的就是放在D/ww下,ww新建的啊,然后在文件夹下,新建文件夹就是你想用的名字啊,在sunlime中File->open folder打开这个文件夹就行了啊,方法很笨,不过很好操作啊.

开始操作吧,在sublime中文件夹下右键新建文件,起名index.html和style.css,在此准备工作做完了,下面就是两者的代码了:

index.html:

拉勾

拉勾网是最权威的互联网行业招聘网站,提供全国真实的互联网招聘信息,工资不面议当面谈,找工作,招聘网,寻人才就来拉勾网,互联网行业找工作首选拉勾网

• 技术
  
  
  
  • JAVA
  
  
  • Android
  
  
  • PHP
  
  
  • Html
  
  
  
  

• 设计
  
  
  
  • UI设计师
  
  
  • 交互设计
  
  
  • 网页设计师
  
  
  • 平面设计
  
  
  
  

• 产品
  
  
  
  • 产品总监
  
  
  • 产品经理
  
  
  • 游戏策划
  
  
  
  

• 运营
  
  
  
  • 新媒体运营
  
  
  • 运营总监
  
  
  • COO
  
  
  
  

• 市场和销售
  
  
  
  • 市场推广
  
  
  • 市场总监
  
  
  • BD
  
  
  • 市场策划
  
  
  
  

• 职能
  
  
  
  • HR
  
  
  • 行政
  
  
  • 财务
  
  
  • 审计
  
  
  
  

• 金融
  
  
  
  • 投资
  
  
  • 融资
  
  
  • 并购
  
  
  • 风控
  
  
  
  

点击左侧,给自己一个可操控的未来

 

拉勾App,最受欢迎互联网求职平台.

style.css:

body{
margin:0;
}
#header {
    background-color:#333;
    color:#0f0;
    margin-top: 0;
    text-align:left;
    padding-left: 70px;
    height: 30px;
    margin-top: -20px;
    margin-bottom: -16px;
}
#next{
background-color:#ccc;
    color:#000;
    text-align:left;
    padding-left: 30px;
    margin-bottom: 40px;
    height: 50px;
}
#left {
line-height:30px;
    background-color:#eeeeee;
    height:1100px;
    width:200px;
    float:left;
    padding:10px; 
    margin-left: 150px;
}
#center {
background-color:#eeeeee;
    width:770px;
    height: 1500px;
    float:left;
    padding:10px; 
    margin-left: 20px;
}
#footer {
    background-color:black;
    color:white;
    clear:both;
    text-align:left;
    padding:15px; 
}
}

效果图如下: