关于CSS Normalize的文件配置

这篇文章主要介绍了css normalize文件配置示例,对全局项目进行设置,需要的朋友可以参考下

作为前端工程师,很多人都有自己的一套CSS Normalize文件,这样能省掉开发过程中的不少麻烦,提高工作效率。在前人的基础上,我总结了自己的CSS Normalize文件,目前基本上每个项目都有在使用中:

  1. /*Normalize*/*{margin:0;padding:0;list-style-type:none;}   *html,*html body /* 修正IE6振动bug */{       background-image:url(about:blank);       background-attachment:fixed;   }   body{       font-family:"Microsoft Yahei","Hiragino Sans GB" ,Arial,Lucida,Verdana,SimSun,Helvetica,sans-serif;       /*font-size : 62.5%; px数值除以10,然后换上em作为单位*/    /*min-width:980px;*/    font-size:13px;   }   a,img{border:none;text-decoration:none;}   a{blr:expression(this.onFocus=this.blur());} /*去掉a标签的虚线框,避免出现奇怪的选中区域*//*a:active {test:expression(target="_blank");}*/:focus{outline:0;}   label{cursor:pointer;}   img{vertical-align:middle;}   table{empty-cells:show;border-collapse:collapse;border-spacing:0;}   h1{font-size:1.6em;}h2,h3,h4{font-size:1.4em;}h5,h6{font-size:1.2em;}   input{border:none;}   textarea{overflow:scroll;}   a, input,textarea, .hover-delay {       font-family:"Microsoft Yahei","Hiragino Sans GB", Arial,Lucida,Verdana,SimSun,Helvetica,sans-serif;       -webkit-transition: all 0.3s ease-out;       -moz-transition: all 0.3s ease-out;       -ms-transition: all 0.3s ease-out;       -o-transition: all 0.3s ease-out;       transition: all 0.3s ease-out;   }   input.none-radius{       border-radius:0;       -moz-border-radius:0;       -webkit-border-radius:0;   }   input::-ms-clear{ display:none;}  //去掉输入框的叉叉   .clear{clear:both;}   .txt-indent{text-indent:-999px;overflow:hidden;}   input[type=text],input[type=tel],input[type=email]{   -webkit-appearance: none;    box-shadow: none;}   /*Normalize end*/

登录后复制

对与我的实际使用中,我有一个Template文件夹(最近新增了一个针对Mobile)

里面的文件夹大致分为如下:

    1)images: 存放项目中的图片(里面又会根据项目模块进行文件夹划分)
    2)css: 存放css文件(里面会有一个base.css文件,预置上文中的css normalize)
    3)js:存放js文件,里面还有一个vender的文件夹,存放插件js(例如:jQuery库),外面有main.js(主要js文件),plugins.js(插件引用的js)

立即学习“前端免费学习笔记(深入)”;

根目录下,为index.html文件
主要为如下文件:

  1. nbsp;html>              <!--                        <span class="pln">xxx</span>                                                                                                 

                  

                          

                                     

               

                                     

               

                                           

                          

               

                                     

               

                                     

               

                                           

                          

                          

                          

                              

登录后复制

Mobile下的head会有如下meta设置:

  1.          

登录后复制

值得一提的是,在github上也有做了一个 normalize.css 文件,我在做HTML5项目也将其应用在normalize中。 

另外,对于很多开发中来说,Template文件同样是节省了不少写重复代码的时间,同时,又规范了自己的书写习惯。

以上就是本文的全部内容,希望对大家的学习有所帮助,更多相关内容请关注PHP中文网!

相关推荐:

CSS的变量variable的解析

CSS的变量variable的解析

以上就是关于CSS Normalize的文件配置的详细内容,更多请关注【创想鸟】其它相关文章!

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
编程技术

CSS中易忽略的特性

2025-3-10 23:19:18

编程技术

CSS编写代码时的高性能总结

2025-3-10 23:19:36

0 条回复 A文章作者 M管理员
欢迎您,新朋友,感谢参与互动!
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
私信列表
搜索