草庐IT

【CSS】CSS样式的优先级

全部标签

javascript - 重新计算样式 : why so stuttering?

假设我们有一段代码可以将一系列相似的元素注入(inject)到DOM中。像这样:varCOUNT=10000,elements=Object.keys(Array(COUNT).join('|').split('|'));vard=document,root=d.getElementById('root');functioninject(){varcount=COUNT,ul=d.createElement('ul'),liTmpl=d.createElement('li'),liEl=null;console.time('Processingelements');while(coun

javascript - 删除所有 CSS 规则

有没有办法在加载样式表后清除所有CSS规则?我必须使用构建在Dojo之上的专有JavaScript库(ESRI'sArcGISServerAPI)。我广泛使用Dojo的小部件,并想使用Dojo的claro主题,但不幸的是,ESRI库通过加载场外CSS文件(可能还有在JS中硬编码的CSS规则)来破坏CSS。这最终破坏了Claro主题。如此多的Dojo小部件CSS类被重写并创建了新规则,只需清除所有CSS并重新加载标准Dojo样式表似乎更容易/更安全。像下面这样的东西会很好:*{none}但我想我最终将不得不使用Dojo或jQuery来完成此任务。 最佳答案

javascript - 使用 :hover javascript 设置样式

我了解到,由于浏览器兼容性,以下方法非常适合设置CSS样式。element.style.cssText="color:red;";我不能做的是使用cssText在:hover和:focusCSS事件上应用样式。我该怎么办?element.style.cssText=":focus{color:red;}";附言不要提及使用javascript事件,例如onmouseover而不是CSS:hover(这不适合我的情况。) 最佳答案 你可以用一些巫毒魔法来做到这一点:varhead=document.getElementsByTagNa

javascript - Ckeditor 在应用样式时添加空段落

我的CKEditor在将样式应用到选定段落时添加了很多不必要的标签我使用以下html启动CKeditor:Hi,thisatext!当我选择段落并使用工具栏应用样式时,CKEditor将我的html格式化为以下格式:  Hi,thisatext!  有什么方法可以阻止CKEditor添加带有不间断空格的段落吗?我已经尝试过将config.fillEmptyBlocks=false;和config.IgnoreEmptyParagraphValue=true;添加到我的配置文件中更新原来这个问题是由样式本身引起的,它是自定义样式。这段代码是问题所在

javascript - 任何 css 或 javascript 技术来显示圆形图像的 'slice'?

我正在尝试编写一个程序,用户可以在其中上传圆形图像,例如这个美味的热披萨:然后用户以度数指定弧的起点和终点,以便调用一个函数来显示相同​​的图像,剩余部分的不透明度较低。functioncutPizza(startArcDegree,endArcDegree){//ThisiswhereIneedhelp}cutPizza(150,225);是否有任何css或javascript技术可以帮助我实现这一目标(或与此相关的任何方法)? 最佳答案 是的,您应该有一个Canvas,该Canvas与您的披萨图像具有相对位置。然后你可以在Can

javascript - 正则表达式将逗号分隔的 css 类名称字符串拆分为数组

我需要将CSS类名称字符串拆分为JavaScript中的CSS类名称数组。以下所有字符串应生成相同的数组。'lmn-button,lmn-button-primary'=>['lmn-button','lmn-button-primary']'lmn-button,lmn-button-primary'=>['lmn-button','lmn-button-primary']//Notethespaceaftercomma'lmn-button,lmn-button-primary'=>['lmn-button','lmn-button-primary']//Notethespaceb

javascript - 是否可以仅使用 CSS 保持垂直节奏?

我正在开发一个面向排版的WordPress主题,但我遇到了内嵌图像的问题。我可以控制每一个元素并调整它的行高、底边距等,以保持垂直节奏。但是由于通过编辑器粘贴的图像可以有任意高度,它们显然会扰乱以下所有内容。是否可以使用边距、填充、两者或其他解决方案来确保独立于图像大小将调整到基线?我知道有一些替代方案,比如让所有图像变成行高的倍数,这样我就可以保持节奏。其他选择是使用JavaScript,不太理想,但如果没有CSS解决方案,我将不得不考虑。 最佳答案 (已编辑——新的和改进的解决方案)我不知道WordPress是否提供了任何方法来

javascript - 在 chrome 中为 console.table() 添加样式

我正在用JavaScript构建一个简单的单元测试方法。输出正在控制台中打印。我希望通过的测试行为绿色,失败的测试行为红色(背景或文本)。我知道我可以向console.log()添加样式,但我还没有找到向console.table()添加样式的方法。那么,这有可能吗?如果没有,还有什么替代方案。代码示例:console.table([{status:'failed',function:'Validate.int',asserted:true,result:false},{status:'passed',function:'Validate.float',asserted:true,re

javascript - jQuery UI sortable 在排序时触发 css3 动画

我有一些sortables,它们通过一个类定义了CSS3关键帧动画。排序时,我注意到在thisFiddle.中看到的奇怪行为.slideLeft{animation-name:slideLeft;-webkit-animation-name:slideLeft;animation-duration:1s;-webkit-animation-duration:1s;animation-timing-function:ease-in-out;-webkit-animation-timing-function:ease-in-out;visibility:visible!important;

javascript - CSS3 动画 - 使用过渡 : 时不会触发 animationstart 事件

鉴于以下情况:.slide{transition:all1sease0s;transform:translateX(-100%);}和document.documentElement.addEventListener('animationstart',function(){alert(1);},false);该事件不会触发。但是,如果CSS是:.slide{animation:slide1sinfinite}@keyframesslide{from{transform:translateX(0);}to{transform:translateX(-100px);}}它确实火。怎么来的?