个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
27
4
我使用 Colorzilla CSS 渐变生成器创建了一个具有多个色标的背景。它在 Firefox 和 Safari 中运行良好，但在 Chrome 中有一个微妙的条纹/ strip ，这令人沮丧。这是我的代码和一个 jsfiddle 链接:
body {
background: rgb(0,0,0); /* Old browsers */
background: -moz-linear-gradient(left, rgba(0,0,0,1) 0%, rgba(85,187,0,1) 15%, rgba(85,187,0,1) 25%, rgba(221,34,85,1) 45%, rgba(221,34,85,1) 55%, rgba(0,136,238,1) 75%, rgba(0,136,238,1) 85%, rgba(0,0,0,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,1)), color-stop(15%,rgba(85,187,0,1)), color-stop(25%,rgba(85,187,0,1)), color-stop(45%,rgba(221,34,85,1)), color-stop(55%,rgba(221,34,85,1)), color-stop(75%,rgba(0,136,238,1)), color-stop(85%,rgba(0,136,238,1)), color-stop(100%,rgba(0,0,0,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, rgba(0,0,0,1) 0%,rgba(85,187,0,1) 15%,rgba(85,187,0,1) 25%,rgba(221,34,85,1) 45%,rgba(221,34,85,1) 55%,rgba(0,136,238,1) 75%,rgba(0,136,238,1) 85%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, rgba(0,0,0,1) 0%,rgba(85,187,0,1) 15%,rgba(85,187,0,1) 25%,rgba(221,34,85,1) 45%,rgba(221,34,85,1) 55%,rgba(0,136,238,1) 75%,rgba(0,136,238,1) 85%,rgba(0,0,0,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left, rgba(0,0,0,1) 0%,rgba(85,187,0,1) 15%,rgba(85,187,0,1) 25%,rgba(221,34,85,1) 45%,rgba(221,34,85,1) 55%,rgba(0,136,238,1) 75%,rgba(0,136,238,1) 85%,rgba(0,0,0,1) 100%); /* IE10+ */
background: linear-gradient(to right, rgba(0,0,0,1) 0%,rgba(85,187,0,1) 15%,rgba(85,187,0,1) 25%,rgba(221,34,85,1) 45%,rgba(221,34,85,1) 55%,rgba(0,136,238,1) 75%,rgba(0,136,238,1) 85%,rgba(0,0,0,1) 100%); /* W3C */
width:100%;
margin-bottom:1em;
}
http://jsfiddle.net/yL82a/(忽略 margin-bottom 声明)
知道如何在 Chrome 中解决这个问题，让它成为一个漂亮的平滑渐变吗？我已经尝试使用 rgba 和十六进制值并得到相同的结果。
最佳答案
我想让整个页面有一个渐变背景，这个问题很烦人。最后，我可以通过应用 -webkit-filter: blur(3px); 来移除条纹。至 <body> ，但后来整个内容都模糊了，所以我单独做了一个<div>作为页面的背景，并对其应用过滤器。
CSS:
html, body {
width: 100%;
margin: 0;
}
#page-background
{
width: 100%;
height: 100%;
background: #383838; /* Old browsers */
background: -webkit-linear-gradient(top, #383838 0%,#d6d6d6 100%); /* Chrome10+,Safari5.1+ */
(...)
-webkit-filter: blur(3px);
}
HTML:
<body>
<div id="page-background"></div>
And content goes here...
渐变生成于 ColorZilla site .
关于Chrome 中的 CSS 渐变条纹，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14880463/
27
4
0
我正在尝试重用在 jsp 中设置并在 Stripes 布局渲染中使用的变量。 主页:/index.jsp 布局渲染页面:/jsp/widgets/signin/oAuthUrl.jsp 我的/jsp/
我已经测试了几个小时，但我似乎无法让边框图像做我想做的事。 我正在尝试向带有水平条纹的 div 添加底部边框。即2px灰，2px白，2px灰；即灰色和白色条纹。 像这样: 这是我目前所拥有的: .bo
我正在尝试使用一个不错的响应式网站模板 http://html5up.net/striped并遇到了一些问题。我已经设置了一个非常基本的测试。我 downloaded条纹包，在陨石应用程序中创建了一个
为什么这行不通？ (例如，为什么脚本没有实际运行并创建付款按钮，就像它不在指令中那样。) .directive('stripeForm', ['$log', function($log) { re
我有一个表(Maintable)，里面有信息。此外，每个 tr 都有一个子表，其中包含可以在需要时折叠的更多信息。现在，我希望对 maintable 中的 tr 进行 strip 化。我尝试使用:
我有一个表，其中包含由类标记的行。这些行应该是斑马条纹。需要注意的是它们并不总是连续的。 我尝试过按表和类名进行匹配，但最终结果总是不正确。发生的情况是， strip 化将应用于表级别，然后仅在具有该
原始表(http://highspeedbroadband.com.my/home-package/comparison-chart-for-home-package/) 我想修改下图中突出显示的原始
我有以下 html 文件: .table-striped { padding: 0; margin: 0;
这个问题在这里已经有了答案: CSS technique for a horizontal line with words in the middle (34 个答案) 关闭 9 年前。
我有一个 bootstrap 条纹表 ( .table-striped > tbody > tr:nth-of-type(odd){background-color: #f9f9f9;} )，我正在使
我对 Spring MVC 很有经验，正在试用 Stripes 以决定是否在新项目中试用它。 在 Spring MVC 中，我将准备模型数据并将其传递给 View ，方法是将其添加到由我的 Contr
我正在尝试使用 Rails 在 Stripe 中创建一次一次性充电。我收到以下错误: Stripe::InvalidRequestError (No such token: tok_18nnwSJ6t
在 Stripes 中，如果存在错误的操作类映射，Stripes 的默认行为是将控件转发到发出请求的同一个 JSP，并给出完整的错误堆栈。 我计划修改此行为，并希望在出现错误时提供更加用户友好的消息。
我的问题分为两部分: 如何使用 spark 设置(微调)高级 ORC 参数？ 各种帖子显示可能存在问题Spark Small ORC Stripes , How to set ORC stripe s
我有一个 Stripes 框架问题。 这个重定向页面在注解方法之前？ 类似于: @Before public void test() { String login=(String)context.
我想使用 Jest 测试我的 nodejs 代码。在我的代码中，我使用了条纹。 当需要条纹时，你必须使用这一行 const stripe=require('stripe')("apikey"); 为了
在这个例子中: https://jsfiddle.net/ywb77uhv/ 为什么将 strip 路径颜色更改为白色以外的颜色会破坏渲染？如何能够更改路径颜色？ #stri
我在获取斜条纹背景以在 Chrome 中很好地显示时遇到了问题。 background-image: repeating-linear-gradient(-45deg, rgba(0,0,0,0.1)
我想在图像上绘制黑白条纹，在图像顶部水平和垂直地每 20 列切换一次，同时保持在图像边界内。到目前为止，我可以获得一个带有 1 像素宽垂直条纹的黑色正方形。我尝试过通过切换东西来至少在水平线上获得细长
所以我最近一直在尝试学习 Stripe API...我进展缓慢，但在处理这些元数据信息时遇到了一些障碍。 我希望实现的是在创建订阅和客户时向订阅添加元数据。 这是创建客户和订阅的原始脚本: $cust
我是一名优秀的程序员,十分优秀！