问题标签 [box-shadow]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - 有没有办法在页面加载时自动启动 css 过渡或动画?
我想再次将我的盒子阴影从黄色更改为黑色和黄色,然后重复该过程。我不介意有人给我一个 java 脚本答案,我只是想知道该怎么做。
css - 盒子阴影、透视、溢出和背面可见性的非常奇怪的错误:隐藏在 Google Chrome 中
我最近在 Google Chrome 中遇到了一个非常奇怪的渲染行为。如果您使用此小提琴中描述的 CSS 的确切组合(过渡除外,仅用于演示目的):
https://jsfiddle.net/yjtpjstx/1/
你可以让元素看起来比它们实际的位置更低和更靠右。如果您的父元素具有任何透视、任何溢出(隐藏、自动、滚动 - 它们都可以)和带有模糊的框阴影,并且您的子元素具有backface-visibility: hidden那么该子元素内的所有内容都会出现向下移动和右侧为父框阴影中定义的像素数量。元素实际上仍然在它们应该在的地方,它们只是在视觉上移动。尝试单击小提琴中的按钮,并注意它实际上位于父级的左上角,并带有阴影。
关于这里到底发生了什么以及如何解决它的任何想法?在 Firefox 中不会发生。暂时我不得不删除透视,但我在真实情况下有一些动画现在看起来很枯燥没有透视。可能可以摆脱阴影并以其他方式制作它,我可能会,因为我认为这无法解决,但我只是想与世界分享这个,简短的谷歌搜索似乎并不表明之前遇到过.
css - CSS3 filter:opacity(X) 回退到 opacity:X,同样适用于 filter:drop-shadow() 到 box-shadow
我想开始使用当前正在开发的 CSS3 filter:opacity() 和 filter:drop-shadow() 属性,因为我读到它们在某些机器上的某些浏览器中是硬件加速的。但在这个早期阶段,我肯定需要回退到普通的 CSS 属性,如不透明度和框阴影。
问题是,在旧的之后放置新的正常 CSS 后备策略失败了。通常新的(如果支持)会覆盖旧的。但在这种情况下,新旧是完全不同的属性,它们会结合起来!CSS 声明...
...将导致总不透明度为 25% 而不是 50%。
示例: https ://jsfiddle.net/uq4ybvk8/
有什么方法(最好只有 CSS)来创建从新过滤器属性到完善的 CSS 属性的后备?
html - Firefox 无法正确显示带有边框半径的插入框阴影
我在侧边栏的顶部有几个按钮。第一个和最后一个按钮有一个圆角,以匹配侧边栏的边缘。当 时.active
,按钮应该有一个插入框阴影。在 Chrome 中,这可以正常工作。然而,在 Firefox 中,box-shadow 不跟随边界半径,而是有一个尖角。我做错了什么,或者这是 Firefox 呈现阴影的方式中的错误?顺便说一下,这是适用于 Ubuntu 的 Firefox 41.0.1。
我无法发布屏幕截图(公司政策),但我已经提出了一个小提琴(帖子末尾的链接),您应该能够看到问题。
我已经搜索了几天,没有发现任何其他描述这种相同行为的问题。
这是HTML:
和CSS:
还有JSFiddle(请注意,fiddle 还包含一个小 jQuery 以使按钮可点击)。
android - Android和盒子阴影属性
我有以下代码来制作盒子阴影:
它不适用于Android。我正在运行 4.4.2 和 Chrome 45。
html - 使用css创建的三角形的框阴影
我有以下plunker,我使用 CSS 创建了一个三角形。
CSS:
HTML:
在我的 AngularJS 项目中,这个三角形是在我调用此处定义的下拉指令时创建的。
问题是我想给这个三角形和下拉菜单一个盒子阴影。我可以将它应用到弹出窗口(本质上只是一个“ul”列表),但我正在努力处理三角形。如何将框阴影应用于三角形?
html - css 3 盒子阴影左上下下
嘿伙计们,我在玩 CSS box-shadow 属性,我有点挣扎。我试图在一个盒子上创建阴影,但我只想在我的 div 的顶部、底部和左侧应用阴影。
到目前为止,这是我的 css 代码,但它将适用于我不想要的所有 4 个方面。
谢谢
html - 盒子阴影在 Chrome 中是黑色的,但在 Firefox 中是白色的?
其实问题很简单,我的影子在谷歌浏览器里是黑色的,在火狐里是白色的,应该是黑色的。如果您有不同的意见,请务必说出来,因为我还是一名学生。
这是我的 HTML 代码:(它是荷兰语,但它只是为了让您可以看到无政府状态。)
我的 div 类的 CSS 代码rechts
: