首页 > 编程 > HTML > 正文

HTML+CSS项目开发经验总结(推荐)

2019-10-26 17:19:18
字体:
来源:转载
供稿:网友

好几天没更新博客了,刚实战完一个HTML+CSS的简单项目。经过几天的摸索,发现收益良多。之前只是单纯得写demo,看知识点,没有亲自实战项目。但实战过后才会了解,如何才能更好地提升自己的技术。针对这次项目开发,我总结了以下内容:

一、技术总结

1、公共样式的设定

在开始项目之前,我们可以先大体了解一下项目中每个页面的内容,比如字体样式,段落结构,文字大小等。我们可以针对这些内容来设定一个固定的样式文件。在开发中    就可以直接引入此文件,而无需再重复敲CSS代码。

CSS Code复制内容到剪贴板
  • /*基本样式*/   * {   
  •     margin:0;        padding:0;                   
  • }    body {   
  •     font-family: "微软雅黑";    }   
  • .clear {  /*清除两边浮动*/       clear: both;   
  • }    .fl {  /*清除左浮动*/  
  •     float: left;    }   
  • .fr {    /*清除右浮动*/       float: rightright;   
  • }      
  • a {  /*去掉链接的默认下划线*/       text-decoration: none;   
  • }    li { /*去掉列表默认样式*/  
  •     list-style: none;    }  

    需要用到时就直接在类名后加上所要用到的类名即可:

  • <div class="div01 lf"></div>   <div class="div02 clear"></div>  
  • 2、整体布局

    开发项目过程时,若事前先将每一页的框架搭建好,而后期就只需把具体内容填充进去就可以了。而我就习惯用以下框架来实现页面整体布局:   

  • <body>           <div id="header"></div><!--页面顶部内容-->  
  •         <div id="nav"></div><!--导航部分-->           <div id="content"></div><!--页面中间内容-->  
  •         <div id="footer"></div><!--页面底部-->   </body>  
  • 发表评论 共有条评论
    用户名: 密码:
    验证码: 匿名发表