对css还是不熟悉,老是对全局样式无从下手。 从网易拷了一份,学习了一下。

body {margin:0; font:12px/1.5 \5b8b\4f53,Arial,sans-serif; background:#3d78aa;}

div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,p{padding:0; margin:0;}

table,td,tr,th{font-size:12px;}

ol,ul {list-style:none;}

li{list-style-type:none;}

img{vertical-align:top;border:0;}

h1,h2,h3,h4,h5,h6{font-size:inherit; font-weight:normal;}

address,cite,code,em,th,i{font-weight:normal; font-style:normal;}

.hx a,.hx em,.fB{font-weight:bold;}

.clearfix{*zoom:1;}

.clearfix:after{display:block; overflow:hidden; clear:both; height:0; visibility:hidden; content:".";}

a {color:#252525; text-decoration:none;}

a:visited {text-decoration:none;}

a:hover {color:#ba2636;text-decoration:underline;}

a:active {color:#ba2636;}

1、body, 需要记住的是margin,font。  font里面一次定义了12像素,1.5倍行高,宋体的Unicode码(由于在火狐和opera中不能很好的识别),无衬线字体Arial,sans-serif;

2、块元素的预定义 div dl dt dd ul li ol li h1~h6       【pre】(这要用于显示源码)form        【fieldset】(lengend 为标题,位于框中间,主要放在from里面,有特殊显示效果) input textarea      【blockquote】(浏览器在 blockquote 元素前后添加了换行,并增加了外边距。)  p   定义margin和padding属性均为0;

3、定义表格元素属性;

4、列表属性的定义,刚知道li前面的小图标可以用list-style:square inside url(../../img.png);来定义。 ol ul list-style为none ; li的list-style-type为none;

5、图片   居上,边框为0; vertical ; border;

6、超链接的一些属性

a {color:#252525; text-decoration:none;}

a:visited {text-decoration:none;}

a:hover {color:#ba2636;text-decoration:underline;}

a:active {color:#ba2636;}

关于clearfix,下面我会专门抽出一篇文章讨论。

DIV+CSS在不同浏览器中的注意问题

1、ff和ie对高度的渲染方法不同。ff严格按照高度渲染,而ie可以在设置了高度的情况下被撑开。

2、ie的margin在float方向相同时会翻倍。解决方法display:inlie

3、ie和ff中的body,p,hr,ul,li,dl,dt,dd的margin padding默认值不一样。制作网页前设置body,p,hr,ul,li,dl,dt,dd{margin:0;padding:0}

4、ie和ff中h1,h2,h3,h4,h5,h6,h7默认的字体大小不同。需要重新设置

5、ff和ie中对em的渲染效果不一样,简单方法,用单位px,避免用em

6、ie中图片在容器中,图片下面默认有3像素的空隙,解决方法:vertical-align:top

7、ie中有时候不清除浮动不会有问题。而ff严格按照浮动来排列。所以需要严格对每个浮动进行闭合。

CSS透明问题

8、 ff中padding的值会加到高度里面去,例如padding-top:10px;height:100px; 这个css ff翻译出来是 110px,而ie是100px,解决方法,不需要对ff和ie分别设置,直接按火狐的方法设置就可以,在高度中减去padding的值,ie不需要理 会,因为ie会自动撑开。

9、html注释在ie中有时候会影响效果,而ff不会

10、垃圾ie中未知情况下,内容会自动复制一份到下一行,解决方法:复制错位的容器放最下面,然后设置display:none隐藏即可。

11、ie中

  • 的代码间的空格可能影响到效果。而ff不会。

    12、背景透明:IE:filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60)。

    FF:opacity:0.6。

    [注]最好两个都写,并将opacity属性放在下面。

    13.如何对齐文本与文本输入框加上vertical-align:middle;

    14.怎么样才能让层显示在FLASH之上呢解决的办法是给FLASH设置透明

    15.怎样使一个层垂直居中于浏览器中这里我们使用百分比绝对定位,与外补丁负值的方法,负值的大小为其自身宽度高度除以二

    16.万能清除浮动

    .clearfix:after{

    clear:both; /* 清除浮动 */

    display:block;

    visibility:hidden; /* 设置伪类层内容块级不可见 */

    height:0;

    line-height:0; /* 高度和行高为0 */

    content:"";    /* 将伪类层内容清空 */

    }

    .clearfix{zoom:1}

html 设置统一样式,css 全局样式的定义相关推荐

  1. 平台全局 css代码,css全局样式基础代码(示例代码)

    简介这篇文章主要介绍了css全局样式基础代码(示例代码)以及相关的经验技巧,文章约900字,浏览量402,点赞数4,值得参考! body{ font-size:12px; font-family:&q ...

  2. php文章列表样式,css列表样式有哪些?css设置列表样式的方法

    关于列表的css样式有哪些以及如何设置css列表样式?接下来的这篇文章将为大家介绍关于css列表样式的内容. 1.css有序列表(ol)和css无序列表(ul) list.html 列表样式 水果 苹 ...

  3. html中怎么设置滚动条效果,css滚动条样式怎么设置

    为了做出更好的视觉效果,有时候需要用css改变浏览器或版块中滚动条的样式,那么应该怎么实现自定义滚动条样式呢? 一.设置css滚动条的7个属性说明(附参考图). 1  ::-webkit-scroll ...

  4. 【 vue 】局部样式与全局样式

    局部样式 一般都是使用 scoped 方案: <style lang="scss" scoped>... </style> 全局样式 全局样式 目录:@/s ...

  5. css自定义横向滚动条样式,css滚动条样式自定义

    很简单的几行代码 Title * { margin: 0; padding: 0; } .out { width: 600px; height: 600px; margin: 100px auto; ...

  6. php 去掉css样式,css虚线样式怎么去掉

    当超链接变为活动状态或获得焦点时,链接周围会出现一条虚线,以区别于其他链接,这是超链接的默认行为.它基本上是虚线轮廓,不会像边框那样影响周围的元素.想要去掉css虚线样式,我们可以使用CSS属性&qu ...

  7. php外联样式,css外联样式不起作用怎么办

    css外联样式不起作用的解决办法:首先用sublime编辑器打开css文件:然后修改本地css文件编码格式为"utf-16LE":最后重新保存运行即可. 本教程操作环境:Windo ...

  8. html下划线虚线样式,CSS不同样式的虚线下划线

    CSS不同样式的虚线下划线 body{margin:0px;padding:0px;font-size:9pt;background-color:#EEEEEE;} .p1{margin:20px a ...

  9. CSS全局样式的设置

    默认字体设置,边距设置 html {font-family: sans-serif; /* 默认字体 */font-size: 100%; /* 调整字体大小 */-ms-text-size-adju ...

最新文章

  1. Java中? extends T和? super T的理解
  2. 假期充电!20世纪最优秀的物理学家费曼是如何生活、学习和思考的?
  3. 网络通信基础知识普及篇
  4. 【数据结构与算法】之深入解析“序列化和反序列化二叉搜索树”的求解思路与算法示例
  5. 使用pymc3可能遇到的问题及解决方法
  6. mysql何时会走索引
  7. [转] new 和delete
  8. 黑苹果smbios机型选择_黑苹果注入三码洗白教程
  9. 7个实用的Python自动化代码,别再重复造轮子了
  10. 三顾茅庐:刘备如何面试诸葛亮
  11. 树莓派智能小车资料整理
  12. 怎样以两种方式从Mac计算机上的启动板菜单中删除应用程序?
  13. eclipse 编译Android,如何用eclipse编写android程序
  14. 工具 | Cmder 自定义 aliases 命令
  15. ios第三方支付流程
  16. 软件测试之测试用例颗粒度问题
  17. c语言中的warn函数用法,关于c ++:MSVC等同于__attribute__((warn_unused_result))?
  18. 如何下载西门子PLC的CAD图库
  19. 电脑显示没有被指定在上运行_win10系统运行QQ时出现“.dll没有被指定在windows上运行,或者它包含错误”的解决教程...
  20. OCR图片文字识别,人工手动图片标注软件安装过程

热门文章

  1. linux文件比较,合并,查找重复行
  2. datatable select 性能
  3. linux内核如何识别是进程间切换还是线程间切换?
  4. 数据库-MySQL-结果集-ASORDER BY
  5. oracle日期虚数0去掉,第 14 章 使用复数运算库
  6. DTC精彩回顾—金学东:从可迁到好迁:人大金仓打造国产数据库生态 助力企业国产化转型...
  7. 智能时代,企业如何“聚数为智”加速数字化转型?
  8. 青铜到王者:AIOps 平台在腾讯的升级之路
  9. 如何只用一个小时定制一个行业AI 模型?
  10. Mock服务设计与实现:MySQL驱动字节码修改增强