pre如果同时运用了css的border-radius、 overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡。
解决方法:去掉css中border-radius、 overflow其中的任意一个属性即可
具体原因不知道是什么,可能跟firefox的css渲染有关,有知道的麻烦告诉一声
 
html及css代码如下:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
.log {
margin: 100px auto;
width: 1000px;
height: 300px;
overflow-y: auto;
border: 1px solid #ccc;
} .log pre {
font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
display: block;
word-break: break-all;
word-wrap: break-word;
color: #333;
font-size: 11px;
padding: 0px;
margin: 0px;
border: 0px none;
line-height: 30px;
border-radius: 4px;
overflow: auto;
}
</style>
</head>
<body>
<div style="width:1000px;line-height:30px;margin:100px auto;">
pre如果同时运用了css的border-radius、 overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡。<br/>
解决方法:去掉css中border-radius、 overflow其中的任意一个属笥即可<br/>
具体原因不知道是什么,可能跟firefox的css渲染有关吧,有知道的麻烦告诉一声
</div>
<div class="log">
<pre>fefesfffffffffffffffff……………………………………………………………………</pre>
</div>
</body>
</html>

测试代码下载

css pre如果同时运用了css的border-radius、 overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡的更多相关文章

  1. css z-index属性使用过程中遇到的问题

    z-index属性在web开发中会经常使用,其主要的作用简单的说就是把元素的position设置为absolute.fixed之后,可以调节元素在文档上的层级关系.比如经常见到的dialog,mask ...

  2. css学习(1)-- 层叠样式表CSS的基础

    一.什么是CSS CSS是Cascading Style Sheets的简写,它除了可以轻松设置网页元素的显示位置和格式处,甚至还能产生滤镜,图像淡化,网页淡入淡出的渐变效果. 一个样式表由样式规则组 ...

  3. CSS的未来:一些试验性CSS属性

    尽管现代浏览器已经支持了众多的CSS3属性,但是大部分设计师和开发人员貌似依然在关注于一些很“主流”的属性,如border-radius.box-shadow或者transform等.它们有良好的文档 ...

  4. 谈谈一些有趣的CSS题目(十一)-- reset.css 知多少?

    开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

  5. CSS書寫規範及CSS Hack

    基本原则: CSS样式可细分为3类:自定义样式.重新定义HTML样式.链接状态样式. 样式为设计师自定义的新 CSS 样式,影响被使用本样式的区域,用于完成网页中局部的样式设定. 样式名 “.”+“相 ...

  6. Normalize.css源码注释翻译&浏览器css兼容问题的理解

    版本v5.0.0源码地址: https://necolas.github.io/normalize.css/5.0.0/normalize.css 翻译版: /*! normalize.css v5. ...

  7. 前端基础----CSS语法、CSS四种引入方式、CSS选择器、CSS属性操作

    一.CSS语法 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如: h1 {color:red; font-size:14px;} 二.CSS四种引入方式 1,行内式 行内式是在标 ...

  8. java:HTML(table表格,ul列表)和CSS(导入.css文件,三种定义颜色方式,三种样式选择器,a标签属性顺序,)

    1.重点掌握: html: 1.form表单:input,checkbox,seelct,radio,button,submit 2.table表格:thead-->tr-->th;tbo ...

  9. 谈谈一些有趣的CSS题目(八)-- 纯CSS的导航栏Tab切换方案

    开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

随机推荐

  1. IOS响应式编程框架ReactiveCocoa(RAC)使用示例-备

    ReactiveCocoa是响应式编程(FRP)在IOS中的一个实现框架,它的开源地址为:https://github.com/ReactiveCocoa/ReactiveCocoa# :在网上看了几 ...

  2. 检测字节流是否是UTF8编码

    几天前偶尔看到有人发帖子问“如何自动识别判断url中的中文参数是GB2312还是Utf-8编码” 也拜读了wcwtitxu使用巨牛的正则表达式检测UTF8编码的算法. 使用无数或条件的正则表达式用起来 ...

  3. 使用FastReport的UserDataSet时候,遇到TfrxMemoView内容过多而打印不全的问题

    解决方案很简单,就是把Memo所在的Band勾选Stretch就行了.另外还可勾选StartNewPage. 至于UserDataSet本身,猜测就是人为的构造一个类似数据库的集合,大致使用代码如下: ...

  4. (转)fastcgi协议的简单实现

    FastCgi不仅可以用于webserver与PHP的交互,也可用于任何两个应用之间的交互,PHPer用的比较多的应该就是用于两个子系统之间的交互. 比如A系统和B系统分部独立的部署在两台机器上,其之 ...

  5. union all合并记录

    SQL> SELECT empno AS 编码, ename AS 名称, nvl(mgr, deptno) AS 上级编码 FROM emp 2 order by empno 3 UNION ...

  6. 多个文件目录下Makefile的写法

    1.前言 目前从事于linux下程序开发,涉及到多个文件,多个目录,这时候编译文件的任务量比较大,需要写Makefile.关于Makefile的详细内容可以参考网上流传非常广泛的<跟我一起写Ma ...

  7. POJ-2955括号匹配问题(区间DP)

    Brackets Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 4834   Accepted: 2574 Descript ...

  8. DBA 经典面试题(1)

    1:列举几种表连接方式 hash join.  merge join. nest loop join(cluster join). index join    2:不借助第三方工具,怎样查看sql的执 ...

  9. linux驱动面试题2

    1.什么是GPIO? general purpose input/output GPIO是相对于芯片本身而言的,如某个管脚是芯片的GPIO脚,则该脚可作为输入或输出高或低电平使用,当然某个脚具有复用的 ...

  10. 高仿qq聊天界面

    高仿qq聊天界面,给有需要的人,界面效果如下: 真心觉得做界面非常痛苦,给有需要的朋友. chat.xml <?xml version="1.0" encoding=&quo ...