草庐IT

【CSS】CSS样式的优先级

全部标签

javascript - 在 Chrome Devtools 中检测和观察对样式表所做的更改

我想做的是检测使用Chrome开发工具所做的样式更改(通过修改现有规则或创建规则),以便在我的Web应用程序中我可以通过保存这些更改来保留它们。到目前为止,我能想到的唯一方法是遍历所有元素并获取它们的计算样式,但是此方法不适用于类。除非有某种方法可以获取类的样式信息,而无需实际将其分配给元素-或者遍历所有已知类,将其应用于元素并使用其计算样式?无论哪种方式,这似乎都是一个非常棘手的解决方案,我想知道是否有更好的方法来处理这个问题。我应该澄清一下——我不想使用开发工具本身将更改保存为完整文件。我想跟踪仅个别更改并且在来自javascript的应用程序本身的上下文中。这不是链接问题的副本。

javascript - 如何在 Vue JS 的单个文件中访问样式内的组件变量

有没有vue插件可以让我们在side中使用模板变量?单个文件组件中的标记,例如{{display}}exportdefault{data(){return{display:'block'}}}body{display:{{display}}}任何更好的方法/插件来做到这一点??我已经知道:style和:class 最佳答案 里面的Vue模型(数据层)我觉得没办法访问在当前版本的Vue.Vue只能控制DOM树,不能帮助您处理CSSOM。您可能正在使用WebPack或其他bundler,并在您拥有的单个文件中编写模块化组件。,,和.您的

javascript - 如何仅使用 CSS3 将动态创建的元素平滑地添加到 DOM 中?

我的需求很简单,但我找不到合适的解决方案。我创建元素并将它们作为元素列表添加到DOM,每个新元素都在旧元素之前添加。我希望“顺利”添加新元素。每个元素的高度是动态的,因此必须符合CSS规则。我想我必须使用CSSanimations和keyframes,据我所知我不能使用transitions因为有时itisnotrenderedbythebrowser.我不想使用Javascript,所以我更愿意避免使用setTimeout()或jQuery的解决方案。我确信这可以使用现代CSS正确完成,但我仍然需要找到正确的方法。我有一个解决方案的开始(见下文),但是仍然有max-height:10

javascript - jquery 将所有样式表插入 iframe

如何将父窗口的所有样式表插入iframe的头部(相同域)?我基于类似问题尝试的代码:function(){vard=frames[0].document;varstylesheets=$("link").outerhtml;d.open();d.write(''+stylesheets+''+'');d.close();}显然这在IE之外不起作用。提前致谢。编辑:根据安东尼的回答尝试:$("link[type='text/css']").each(function(){varstylesheet=$(this).clone();$("iframe").contents().find("

javascript - CSS 谷歌地图自定义信息窗口

我一直在使用来自http://gmaps-samples-v3.googlecode.com/svn/trunk/infowindow_custom/infowindow-custom.html的代码,这是目前谷歌关于如何在MapsAPIv3中创建自定义InfoWindow的最佳示例。我一直在研究它,到目前为止我已经接近工作了,除了一件事,它是div容器,文本内容不会扩展以适应内容,所以它只是掉落而不是扩大气泡。如果我给内容容器一个固定的像素宽度,它可以正常工作,但我无法根据其中的文本量来扩展它。我已经在这个问题上停留了一段时间。任何帮助将不胜感激!这是HTML页面Gayborhood

javascript - 如何在生产环境中加载 minify css

我的元素中加载了很多JS和CSS。为了提高网站性能,我开始使用与Ant构建集成的YUICompression。因此,每次我构建元素时,它都会创建带有附加“-min.js”的缩小文件示例:构建后的myscript.js,新文件“myscript-min.js”。现在我已经更改了所有文件以在我的页面中加载myscript-min.js。是否有任何自动化或更简单的方法来加载minify文件。提前致谢!!! 最佳答案 在您的代码中,尝试确定您加载页面的环境(生产或开发)。例如,在本地机器上开发时,您可以检查您的IP地址、服务器环境变量(使用

javascript - 如何检测CSS动画的重绘率(fps)?

我对CSS动画的流畅性很感兴趣。作为一些额外的要点:我最感兴趣的是移动设备(WebKit)的性能,如果可以在正常操作期间收集数据(真实用户做真实的事情),那将会有所帮助。 最佳答案 ChromeBetaforAndroid支持通过在chrome://flags中设置flag获取FPS 关于javascript-如何检测CSS动画的重绘率(fps)?,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/qu

Javascript Firefox - 如果样式表中存在 @import,则无法查询 cssRules - 错误或预期行为?

如果@import出现在css样式表中,我将无法查询cssRules。是否符合网络标准?或者它知道Firefox的限制?注意:我正在从同一域导入css文件。varstyle_rules=document.styleSheets[0].cssRules;console.log(style_rules);底层对象不支持参数或操作[BreakOnThisError]varstyle_rules=document.styleSheets[0].cssRules; 最佳答案 属性document.styleSheets[0].cssRules

javascript - 在 javascript 中包含 base64 gzipped 样式表/图像?

我知道您可以在javascript文件中以base64格式存储css和图像以及其他文件类型。然而,它们相当大......并且压缩后,它们缩小了很多,即使base64编码的开销约为33%。非gzip压缩,图片为data:image/gif;base64,data:image/jpeg,data:image/png,css为data:text/css;base64。那么,我可以/应该使用什么mime类型来包含gzip压缩的css或图像数据URI?(或者如果gzip+base64不能工作,我可以做任何其他压缩来减小字符串的大小,同时仍然将数据存储在javascript中吗?)..编辑..我认

javascript - 为什么我的 jQuery UI CSS 在 JSFiddle 中不起作用?

为了用JavaScript输入回答问题,我经常使用JSFiddle上的演示.它非常有用,但是当我回答thistooltip时问题我需要使用jQueryUI.这种用法的问题是,您可以在框架选择中检查jQueryUI,但它只加载js文件而不加载css文件。所以我决定链接到这个http://jqueryui.com/themes/base/jquery.ui.all.css在jQueryUI的官方演示中使用。=>问题解决了。真的解决了吗?没有?!因为如果用户之前打开过一个jQuery演示,这个链接会很好用,但正如我在工作中看到的那样,如果我只打开fiddle而没有打开一个演示,它就不起作用。