我正在尝试在段落中添加行,但无法将下面的线性渐变语法转换为 -webkit-gradient 语法,因为 Rails 的 wicked_pdf 不支持线性渐变。
任何帮助,我无法在网上找到 -webkit-gradient 文档。
linear-gradient(180deg, rgba(230, 230, 231, 1) 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%);
最佳答案
你这样做:
-webkit-gradient(<type>, <point> [, <radius>]?, <point> [, <radius>]? [, <stop>]*)
<type>
是线性的或径向的。
<point>
是一对空格分隔的值。该语法支持数字、百分比或关键字 top、bottom、left 和 right 来表示点值。
[, <radius>]?
是一个数字,仅在 <type>
时使用是径向的。
<stop>
是一个函数,color-stop
, to
,或from
。 color-stop
有 2 个参数:停止值(百分比或 0 到 1.0 之间的数字)和颜色(任何有效的 CSS 颜色)。 to(color)
相当于 color-stop(0, color)
和from(color)
相当于 color-stop(1.0, color)
。
示例:-webkit-gradient(linear, left top, left bottom, from(#00abeb), to(#fff), color-stop(0.5, #fff), color-stop(0.5, #66cc00))
您还可以使用-webkit-linear-gradient(angle, startColor, endColor)
示例:-webkit-linear-gradient(135deg, white, black)
您的具体示例如下:
-webkit-linear-gradient(180deg, rgba(230, 230, 231, 1) 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%);
来源:
https://webkit.org/blog/175/introducing-css-gradients/
https://webkit.org/blog/1424/css3-gradients/
关于html - 将线性梯度语法转换为 -webkit-gradient 语法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57169945/