腾讯云
开发者社区
文档
建议反馈
控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
搜索
搜索
关闭
发布
登录/注册
精选内容/技术社群/优惠产品,
尽在小程序
立即前往
文章
问答
视频
沙龙
2
回答
jQuery/JavaScript函数无法识别"-webkit-clip-path“吗?
javascript
、
jquery
、
html
、
css
我正在尝试使用CSS的剪辑路径功能,我知道它在我身上工作得很好。然后,我尝试编写一些JavaScript来更改剪辑路径的开始/停止位置。这是我的CSS: .background-left { width: 100%; background-color: #ff8800; background: url("someimage.jpg"); background-size: cover; background-position: center center; height: 100vh; transition: all 1s
浏览 0
提问于2015-12-02
得票数 1
1
回答
CSS蒙面动画看上去非常紧张
css
、
css-animations
我想创造一个效果与CSS掩蔽,其中蒙面图像移动非常缓慢,而面具形状保持静止。现在我正在用相反的动画来做,但是你可以看到它看起来很紧张.任何想法或建议都是非常感谢的!我也不反对非CSS的解决方案。 HTML: <div class="masked-section"> <img src="https://images.unsplash.com/photo-1486903658356-4006b8abd767?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=178c7b6760bd8079517467
浏览 0
提问于2018-03-07
得票数 1
回答已采纳
1
回答
SVG clipPath来裁剪*外层*内容
svg
、
clipping
、
masking
通常,<clipPath>元素隐藏所有超出剪辑路径的内容。为了达到相反的效果--也就是从图像中“剪掉”一些东西--我想在clipPath和clip-rule="evenodd"属性中使用两条路径。基本上,我想要"xor“剪辑路径。 但不起作用。它显示了“ORed”区域: <clipPath clip-rule="evenodd" id="imageclippath" clipPathUnits = "objectBoundingBox"> <rect clip-rule=
浏览 2
提问于2011-01-27
得票数 23
回答已采纳
3
回答
可以在没有外部文件的情况下将webkit css掩码与SVG一起使用吗?
javascript
、
css
、
webkit
、
svg
Webkit允许使用外部SVG文件作为任何HTML元素的掩码。即: <img src="kate.png" style="-webkit-mask-image: url(circle.svg)"> 结果是: (更多信息请访问:) 有没有人知道有没有一种不需要外部SVG文件的方法?更具体地说,它可以用javascript生成的SVG来完成吗?
浏览 0
提问于2010-10-28
得票数 5
回答已采纳
2
回答
无法在firefox中运行SVG动画
html
、
css
、
svg
我在网上找到了这个SVG动画,它在Chrome中工作,但在Firefox中不起作用。我找到了很多答案,补充说-webkit-但仍然不起作用。我试图将translateX()中的百分比更改为像素,但什么也没有。或者我做得不对。 HTML: body { background: #333; padding: 2em; } svg { display: block; left: 50%; max-width: 8em; position: absolute; top: 50%;
浏览 2
提问于2018-03-03
得票数 2
回答已采纳
1
回答
CSS背景- SVG元素的过滤器
css
、
svg
、
blur
、
css-filters
我正在尝试将一个添加到一个SVG <rect>中,它位于另一个SVG <rect>的基础上。 但是,CSS属性backdrop-filter: blur(10px)和-webkit-backdrop-filter: blur(10px)似乎对SVG元素没有任何影响。当我对两个<div>做同样的操作时,它可以工作。 如何才能对两个<rect>实现相同的效果? body, html { margin: 0; } .outerrect { position: absolute; left: 0px; top: 120px; }
浏览 0
提问于2018-03-20
得票数 4
回答已采纳
3
回答
具有图像背景的v字形页面
html
、
css
、
css-shapes
我正试着做一个只有一页的网站。但我想要一些东西,使它从所有其他类似的网站多样化。我想出了做一个v形切片的想法。 我希望每一节都以"v“结尾。我不知道如何在css中实现这一效果,这样就不需要切割作为背景的图像。我没有在互联网上找到任何例子。以下是我的尝试: HTML: <div class="wrap" style="z-index: 9999"> <img src="https://farm8.staticflickr.com/7187/6895047173_d4b1a0d798.jpg" /> &
浏览 7
提问于2014-12-12
得票数 4
回答已采纳
1
回答
SVG <clipPath>适合集装箱和使用%单位
html
、
css
、
svg
、
clip-path
因此,我一直试图为一些不同颜色的文本制作一个挥动动画,因为我使用的是<clipPath>和-webkit-clip-path。.holder div包含两个具有相同文本的元素,一个是白色的,一个是灰色的,clip-path是应用于后者的。 问题是,我需要<path>坐标与文本的大小成比例。这是一个。 我试过设置一个viewBox="0 0 100 100",它不起作用。 我也尝试过使用clipPathUnits="objectBoundingBox",但在这种情况下似乎不起作用,我猜是因为文本是display:i
浏览 1
提问于2015-02-28
得票数 2
回答已采纳
1
回答
在SVG sprite中不工作的剪辑路径
svg
(上的实例) 我正在使用<symbol>元素在应用程序中包含SVGs (有关原因的详细信息,请参见 ),而某些图标--包括clip-path的图标--当我将它们的图标包含在带有<use>元素的页面中时不会呈现。 <svg style="display: none"> <symbol id="icon-pin" viewBox="0 0 24 24" enable-background="new 0 0 24 24"> <path fill="none"
浏览 1
提问于2015-04-06
得票数 4
回答已采纳
1
回答
内部和外部SVG的剪辑路径
html
、
css
、
svg
我试图使用内部和外部SVG创建一个三角形。 然而,由于某些原因,这是行不通的。 我试着在这里使用这个工具: 并得到它的“点”坐标,以创建一个完美的剪辑三角形,在我的内部和外部SVG,但没有运气。 这是我的HTML: <figure class="clip-holder"> <img src="https://www.thesun.co.uk/wp-content/uploads/2016/06/nintchdbpict000244881006.jpg" class="clip-svg-inline" width=
浏览 3
提问于2016-06-21
得票数 0
3
回答
动画中的剪贴画路径和SVG rect
css
、
css-animations
、
clip-path
我试图做一个花哨的动画只在CSS。我从一本关于W3学校的教程开始,想让它变得更好。我的想法是让一个正方形的装载机顺时针旋转,而另一个内部会转向相反的方向。 在链接上,你会看到我在说什么,唯一的区别是我希望红色部分转向相反的方向。 为了做到这一点,我尝试添加另一个类名为.spinner的div。这是我的尝试: .loader-container { position: absolute; left: calc(50% - 75px); width: 150px; height: 150px; padding: 5px; border: 1px solid red;
浏览 6
提问于2016-07-23
得票数 0
回答已采纳
1
回答
SVG剪辑路径视图框不工作
html
、
css
、
svg
我正在尝试将SVG剪辑路径添加到div元素。 我希望剪辑路径跨越整个div元素。 我给了SVG一个viewbox,并在这个viewbox中给出了裁剪路径多边形的点。 但是,多边形似乎不会根据viewbox或容器的高度和宽度来调整其高度和宽度。它保持静态。 我怎么才能让它工作呢?下面是我的SVG代码: <?xml version="1.0" encoding="UTF-8" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "h
浏览 1
提问于2014-06-19
得票数 1
1
回答
页眉栏中的透明圆圈CSS
html
、
css
、
webkit
、
fixed
基本上,我希望看到圆圈切割通过固定的标题栏,所以我可以看到什么在容器滚动时。 CSS: .container { width: 960px; height: 600px; margin-left: auto; margin-right: auto; background: grey; } p { font-family: arial; } li { font-family: arial; } #page-header { display: inline-block; position: fixed; wi
浏览 3
提问于2015-01-17
得票数 1
回答已采纳
3
回答
SVG动画与Safari 13.1 (Mac & IOS)搏斗
css
、
svg
、
safari
、
css-animations
、
svg-animate
我刚刚意识到,MacOS10.15.4和iOS 13.4附带的最新版本Safari (v13.1)不再支持SVG文件中的css动画。我使用这个技巧在我的投资组合中显示一个加载动画。现在只显示下垂文件的第一个帧,动画没有启动。 Chrome或Firefox没有问题。 编辑 以下是嵌入该文件的页面中相应的CSS属性 .loading { background-color: $black-color; position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow: hid
浏览 6
提问于2020-04-01
得票数 4
回答已采纳
1
回答
创建心形进度加载器| Reactjs
javascript
、
css
、
reactjs
、
material-ui
我想为react项目制作一个心形的进度加载器。我试着使用css。但是,它没有正确地显示进度,就像它只覆盖了心脏设计的一部分。下面是代码,我试着这样做。进度应该从底部开始,如果是100%,则需要达到。请检查并让我知道,我如何才能做到这一点。 提前感谢 /***Progress***/ import React, { Component } from 'react'; import ProgressBar from './ProgressBar'; class Progress extends Component { constructor(props
浏览 23
提问于2019-06-24
得票数 1
回答已采纳
1
回答
有什么方法可以为CSS隐藏SVG剪裁路径吗?
html
、
css
、
svg
我有一个想要剪辑的DIV元素。 我能够使用-webkit-clip-path引用SVG clipPath元素并剪辑元素: 示例HTML <svg width="0" height="0"> <clipPath id="clipping"> <polygon points="0 100, 300 30, 220 290" /> </clipPath> </svg> <div id="tiles"></div
浏览 2
提问于2013-07-24
得票数 4
回答已采纳
1
回答
SVG clipPath坐标问题
html
、
css
、
svg
我在SVG clipPath对齐和转换方面有一些问题。 以下是我的HTML代码: <div class="box"></div> <svg height="100%" width="100%" viewBox="0 0 600 600" > <clipPath id="clipped"> <circle cx="100" cy="100" r="50"></circle> <
浏览 3
提问于2016-06-18
得票数 1
回答已采纳
2
回答
如何测试剪辑路径支持?
css
、
cross-browser
、
modernizr
clip-path:shape()似乎不能在IE (意料之中)和火狐(有点意外)中工作。有没有办法测试剪辑路径支持?我用的是现代的。(顺便说一句,我知道我可以使用SVG和-webkit-clip-path:url(#mySVG)让它工作)
浏览 2
提问于2014-12-19
得票数 8
3
回答
剪辑路径在firefox [% values]中不起作用
html
、
css
、
svg
、
clip-path
我正尝试在mozilla中运行svg clip-path,但它不起作用。 .mask-1 { -webkit-clip-path: polygon(0% 0%, 58% 0%, 39% 81.8%, 0% 81.8%); clip-path: polygon(0% 0%, 58% 0%, 39% 81.8%, 0% 81.8%); } 它在铬合金中工作得很好。有没有人能帮我解决mozilla和其他浏览器的问题?
浏览 0
提问于2015-11-20
得票数 10
1
回答
SVG圆:圆形作物图像
javascript
、
css
、
svg
我想要创建一个简单的UI,用户在SVG圆圈上盘旋,圆圈变得更大(增加半径)。在每个圆圈内,我想有一个图像/图标。到目前为止,我试验过的最好的方法是对其进行分层;图像首先被追加,然后用fill'none'在顶部圈。对于非svg的情况,它要简单一些,因为我们可以将div的样式调整为如下所示的图片: <div class="cropper"> <img class="picture" src="https:a picturejpg"> </div> CSS .cropper { wid
浏览 0
提问于2018-09-01
得票数 0
1
回答
剪裁路径多边形在chrome上不起作用
google-chrome
、
svg
、
clip-path
嗨, 我有这个SVG文件: <svg preserveAspectRatio="" viewBox="0 0 130 280" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" height="280px" width="130px"> <clipPath id="search"> <polygon points="8.96671,27
浏览 0
提问于2016-06-05
得票数 0
2
回答
SVG剪辑路径不工作
css
、
html
、
svg
我是一个新手网站开发人员,所以请轻松一点。我正试着制作一个美国形状的定制元素。在我的html中,我创建了一个带有clipPath子元素的svg元素,以及一个显示它必须经过的坐标点的多边形元素子元素,但是它没有显示。下面是我的HTML和CSS。 HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="styleshee
浏览 2
提问于2015-07-27
得票数 0
回答已采纳
1
回答
悬停时SVG旋转图像填充
css
、
svg
、
hover
、
svg-animate
我有一个svg面罩,它在悬停时顺时针旋转,在里面填充图片。我希望图片旋转逆时针明智,以补偿旋转的形状上悬停。 我的问题是,当悬停时,图片就会变形。我试图有溢出:隐藏,但它不起作用。 这是我的小提琴: #hex { overflow:hidden; } svg { padding: 50px; width: 200px; height: 200px; transition: all 0.25s; } svg a { -ms-transform: rotate(0deg); /* IE 9 */ -webkit-transform: rotate(0deg); /* Chrome, Safar
浏览 3
提问于2015-08-30
得票数 1
回答已采纳
3
回答
如何为div制作固定的webkit-mask?
jquery
、
html
、
ios
、
css
、
webkit
假设我们有两个块div叠加,它们之间唯一的区别是,在较低的块内容div应用效果假设一个黑白滤镜-webkit-filter: grayscale (100%); 如果div-block p2的高度减小,并同步滚动,那么我们就可以实现黑白颜色内容的过渡效果。 然而,我尝试编写站点是为移动设备设计的,而iOS在动态位置滚动方面存在问题。也可以使用iscroll,但非常慢的工作... 因此,想法是使用webkit-id=掩码来裁剪div-block掩码“p2”,并相对于页面来修复webkit掩码。有关gif动画的更多详细信息,请访问: <div id="scroll" styl
浏览 1
提问于2014-11-16
得票数 0
1
回答
SVG掩蔽在Firefox中不起作用
firefox
、
svg
我试图在图像上添加SVG掩码,使用以下内容: .image { -webkit-mask-box-image: url('mask.svg'); mask-border: url('mask.svg'); clip-path: url(mask.svg); } 而实际的掩码/svg文件类似于: <?xml version="1.0" encoding="utf-8"?> <svg version="1.1" id="Layer_1" xmlns="http://
浏览 2
提问于2016-12-03
得票数 0
1
回答
如何使用svg掩蔽html div元素
jquery
、
html
、
svg
我有一个SVG代码,它画了两条曲线,现在我想掩盖一个html div元素,它包含到SVG线的css3背景梯度。 <!DOCTYPE html> <html> <head></head> <body> <div id="maskDiv" style="width:1280px;height:500px;background: -webkit-linear-gradient(left, rgb(0, 156, 204), rgb(0, 111, 145));"
浏览 1
提问于2014-11-11
得票数 1
1
回答
当位置:绝对值时,使用内联SVG裁剪错误元素的剪辑路径
css
、
html
、
svg
这有点难以解释,所以这里有一个来展示我的意思。 <style> .clip { clip-path: url(#clippath); -o-clip-path: url(#clippath); -moz-clip-path: url(#clippath); -webkit-clip-path: url(#clippath); } </style> <div id="container"> <svg> <defs>
浏览 3
提问于2013-08-14
得票数 1
回答已采纳
1
回答
如何在IE和Firefox上创建一个“剪辑路径”圈?
css
、
internet-explorer
、
firefox
我有这个片段是用来掩盖瘢痕的。它可以在Chrome上运行。 但是如何在Firefox和IE上运行呢?请不要使用radius-borde解决方案... .circle { -webkit-clip-path: circle(100px at 100px 100px); clip-path: circle(100px at 100px 100px) } <img src="http://cp91279.biography.com/Leonardo-da-Vinci_A-Divine-Mind_HD_768x432-16x9.jpg" width="1024
浏览 2
提问于2014-11-05
得票数 3
1
回答
CSS -剪辑路径svg不在firefox上工作
css
、
svg
、
mask
、
clip
、
clip-path
我试图使用剪辑路径,但这并不适用于firefox。我已经搜索过了,并在堆栈溢出中找到了这段代码。我有几个形状实现,但这只是工作在铬和野生动物。 .shape { width: 300px; height: 300px; display: inline-block; position: relative; box-sizing: border-box; -webkit-clip-path: url(#clipper); -moz-clip-path: url(#clipper); clip-path: url(#clipper); background-c
浏览 4
提问于2016-09-16
得票数 1
2
回答
如何使用css对图像进行造型?
html
、
css
我如何用CSS做到这一点,我试着用clip-paht做这件事,但是Mozilla FireFox不支持它! .div{ -webkit-clip-path: polygon(1% 100%, 54% 85%, 67% 81%, 78% 79%, 91% 80%, 100% 82%, 100% 0, 0 0); clip-path: polygon(1% 100%, 54% 85%, 67% 81%, 78% 79%, 91% 80%, 100% 82%, 100% 0, 0 0); }
浏览 2
提问于2017-02-25
得票数 2
回答已采纳
2
回答
基于图像的SVG多边形形状
javascript
、
css
、
svg
、
polygon
我试图通过剪辑路径为Mozilla制作多边形形状。但我无法做到,下面是我的代码,圆的形状,如何将圆变成多边形。 <style> img {clip-path: url(#clipping);} </style> <svg> <defs> <clipPath id="clipping"> <circle cx="284" cy="213" r="213" /> </clipPath> </defs> &l
浏览 3
提问于2014-07-03
得票数 2
回答已采纳
2
回答
制作半圆负CSS边界半径div掩码的最佳方法是什么?
css
、
css-shapes
现在,我看到许多主题使用放置在div上的三角形/箭头掩码。 你可以在视频上看到 但如果可能的话,我想做一个倒(负)边框半径,形成一个半圆,有点像这样 我几乎有径向梯度,但它只是看上去尖锐的Chrome。 .haflcircle { background: -moz-radial-gradient(100% 0, circle, rgba(0,0,0,0) 25px, #000 25px), -moz-radial-gradient(0 0, circle, rgba(0,0,0,0) 25px, #000 25px); ba
浏览 6
提问于2015-09-03
得票数 6
2
回答
剪辑路径/web工具包掩码在SVG是独立文件时工作,但在内联时不起作用。
javascript
、
css
、
svg
、
clipping
、
css-mask
我使用下面的实现来屏蔽一个使用SVG和一些CSS的元素。 //styles.css .elementToBeMasked { width: 100%; height: 100%; position: absolute; z-index: 1; display: block; overflow: hidden; clip-path:url(rhombus.svg#rhombusclip); -webkit-mask:url(rhombus.svg#rhombus); -webkit-mask-repeat:no-repe
浏览 2
提问于2013-11-27
得票数 1
1
回答
Svg多边形笔划
html
、
svg
、
polygon
我是Svg新手,我不明白为什么我不能向这个多边形添加笔划 <img class="clip-svg" src="http://placekitten.com/g/1000/1000" /> <svg xmlns="http://www.w3.org/2000/svg"> <clipPath id="myClip" clipPathUnits="objectBoundingBox"> <polygon poin
浏览 0
提问于2015-05-12
得票数 1
1
回答
背景-在两个重叠的部分不透明的元素上过滤模糊。
html
、
css
、
svg
我希望有两个重叠的,部分不透明的圆圈,顺利地将backdrop-filter: blur应用于它们背后的元素。考虑以下代码: .background { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-image: url("https://images.unsplash.com/photo-1553356084-58ef4a67b2a7?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGV
浏览 2
提问于2022-08-31
得票数 1
回答已采纳
3
回答
如何使用SVG clipPathUnits="objectBoundingBox“
html
、
css
、
svg
、
clip-path
我试着用SVG来掩盖一个图像。 <svg version="1.1" xmlns="http://www.w3.org/2000/svg" width=500 height=300> <defs> <clipPath id="clip"> <path d="M2.16,1.363h23.699c13.739,0,24.899,10.74,24.899,23.999s-11.16... <img width="500" style="clip-
浏览 3
提问于2017-05-20
得票数 9
1
回答
在Safari中滚动不工作的裁剪路径点动画
javascript
、
html
、
css
、
svg
我目前正在做一个项目,其中网站的背景有3个蒙面图像,当用户滚动,这些图像的点移动与滚动。我可以让它在Chrome中运行得很好,但不能让它与任何其他浏览器保持良好关系。由于时间的限制,我目前只需要在Safari和Chrome (其他浏览器可以获得静态图像)中工作。 如果你在Chrome中滚动,你应该会看到想要的效果。我在其他地方读过关于Safari是如何使用SVG的很多问题的,我应该使用一个对象标记,但是我不确定如何应用对象标记,因为我需要内联的点,这样我就可以通过JS更改它们,还是我遗漏了什么? <div id="site-wrap" class="c-sit
浏览 1
提问于2018-03-01
得票数 1
1
回答
轮廓内夹-路径
css
、
clip-path
我正在寻找一种方法来做这个: 我添加了一个剪辑路径来做盾牌形状,但我不知道如何在形状后面添加这个轮廓.轮廓或边框只是不跟随形状。 我试过这样的方法: .shield_mask{ position: relative; -webkit-clip-path: polygon(0 0, 100% 0, 100% 90%, 50% 100%, 0 90%); clip-path: polygon(0 0, 100% 0, 100% 90%, 50% 100%, 0 90%); &:before{ position: absolute;
浏览 0
提问于2019-04-09
得票数 0
2
回答
最简单的方法来转换多边形剪裁路径到Microsoft Edge支持的“剪裁路径”svg?
css
、
svg
、
polygon
、
clip-path
例如,我有一个应用了多边形剪辑路径的css类,如下所示: .services-image-left { -webkit-clip-path: polygon(0 0, 97% 0, 83% 100%, 0% 100%); clip-path: polygon(0 0, 97% 0, 83% 100%, 0% 100%); } 但我知道要在Edge和IE中工作,我需要对svg点使用"clippath“属性。有没有一种简单的方法可以将上面的多边形转换为svg形状,并将其应用于具有.services-image-left类的所有内容,如上面的示例?
浏览 0
提问于2018-06-13
得票数 1
1
回答
有没有办法让WebView小部件使用Chrome,而不是三星/LG安卓手机上内置的WebKit浏览器?
android
、
webview
、
samsung-mobile
、
mobile-webkit
当在安卓应用程序中使用WebView时,Android将利用不同的浏览器来呈现网页。例如,三星设备上的PreAndroid4.4将使用三星股票手机上的基于WebKit的浏览器(即使安装了Chrome,也是默认的web浏览器)。Google /HTC手机预装了Chrome,他们将使用它来渲染网页内容。 我们在三星/LG设备上使用Google这样的网站呈现WebKit浏览器的问题。当在Chrome的同一台设备上打开时--它们呈现得很完美,但在我们的应用程序(使用内置浏览器)中呈现时--它们无法呈现内容。 我正在寻找一种方法,使WebView使用Chrome (如果安装),而不是内置浏览器在设备上给
浏览 5
提问于2015-08-26
得票数 4
回答已采纳
1
回答
将“剪辑-路径”对齐到图像
html
、
css
、
svg
我有一些问题使用SVG剪辑路径。我不知道如何使路径与我正在剪辑的图像对齐--它总是很遥远。这是我的标记: <img class="svg-clipped" src="https://unsplash.it/1200/1200" alt=""> <svg height="0" width="0"> <defs> <clipPath id="svgPath"> <path d="M124.8,656.
浏览 0
提问于2017-08-01
得票数 1
回答已采纳
2
回答
滑块中的剪辑路径在Firefox上不工作。
css
、
firefox
、
polygon
、
clip-path
我想剪掉这张照片。并使用剪贴画的路径。这对Safari和Chrome很好,但Firefox却不行。我搜索了这个网站上的所有问题,这是我的代码的最后一个形状。但仍然无法让它在Firefox上工作。 这是我的形象: <img src="images/ex-board.jpg" alt="First slide image" class="sliderimg"> 这是我的CSS: .sliderimg { width: 100%; height: 357px; -webkit-clip-path: polygon(0 0,
浏览 7
提问于2016-03-27
得票数 0
回答已采纳
3
回答
如何在Microsoft Edge上使用clip-path?
html
、
css
、
svg
、
microsoft-edge
、
clip-path
在为Firefox和Microsoft Edge(ME)制作剪贴头时,我使用了clip-path。它只需将clipPath元素放入SVG元素中,并将clip-path样式放入HTML元素中,即可在Firefox中工作。当我在我身上打开同样的代码时,它没有显示任何东西。 html,body,header { margin:0px; height:100%; font-family: Arial Unicode MS; } button:hover { transition:background-color 0.5s linear; } a:hover,li:hov
浏览 2
提问于2016-09-14
得票数 16
回答已采纳
1
回答
为什么我的SVG剪辑视频只在一种形状上工作而不是另一种?
css
、
svg
、
clip-path
我的css: .svg-clipped { -webkit-clip-path: url(#svgPath); clip-path: url(#svgPath); } .svg-clipped_two { -webkit-clip-path: url(#svgPath_two); clip-path: url(#svgPath_two); } 我的HTML: <!--1st SVG Shape--> <svg xmlns="http://www.w3.org/2000/svg&
浏览 0
提问于2019-01-19
得票数 1
回答已采纳
1
回答
带有mousemove的交互式背景掩码(jQuery,CSS)
jquery
、
css
、
transform
、
mousemove
我正在尝试创建一个具有这种效果的页面: 。 我是对的,直到我试图实现它的背景。我习惯于使用photoshop (带有图层和掩码的),但不幸的是,html没有掩码。 这是我所拥有的。 jQuery: $(document).ready(function() { // calculate screen size var pageHeight = $(window).height(); var pageWidth = $(window).width(); $(window).on('mousemove', function(event) { // h
浏览 1
提问于2016-09-23
得票数 5
回答已采纳
3
回答
CSS:-webkit-mask-image
css
、
google-chrome
、
webkit
我使用的是CSS属性 -webkit-mask-image 要在图像上应用蒙版,请执行以下操作。但是,在chrome中,蒙版会随着您将图像滚动出页面而移动。 如何防止面罩移动?或者它是一个渲染工件? JSFiddle: (在包含地图的框架上向下滚动)。
浏览 2
提问于2013-09-14
得票数 11
回答已采纳
1
回答
如何将CSS内容放在选择框中并旋转它?
css
我想把CSS生成的内容在选择框中,并与CSS旋转它。当我尝试时,它会旋转选择框和生成的内容,但生成的内容最终位于选择框之外。 我怎么才能修复它? <div class="styled-select"> <select> <option>Here is the first option</option> <option>The second option</option> </select> </div> .styled-select
浏览 0
提问于2011-09-21
得票数 0
回答已采纳
2
回答
有没有一种方法可以制作出一篇经过修改的文本?
jquery
、
html
、
css
、
canvas
、
svg
我想在div上放置一个背景图片,并在其上放置一个已执行的文本(即已执行的文本的边框将是白色的)。 所以我只能在文本的另一端看到图像。 因为我的文本是动态的(不可能对每个单词都进行.PNG ),有没有办法在jquery/css中做到这一点?或者唯一的解决方案是SVG/Canvas? 我从哪里开始做这样的任务呢?它必须是跨浏览器的(至少)对于一些主要的版本(例如,我不介意IE7 )。 -webkit-text-fill-color只能在chrome上运行...
浏览 0
提问于2015-08-27
得票数 0
3
回答
使用裁剪路径显示div外部的文本
javascript
、
html
、
css
我们使用的代码来自下面的链接。 https://codepen.io/s-gupta/pen/jOMGbMX body { background: #333; font-family: "SF UI Text", "Avenir", "Helvetica", arial, san-serif; color: #888; } .ccdLogo { background: url("https://crystalcleardesigns.co.uk/img/CCDlogo.svg") no-repeat cent
浏览 38
提问于2020-12-22
得票数 2
回答已采纳
4
回答
具有正确方向CSS和HTML的所需的五边形形状
html
、
css
、
css-shapes
如果没有-webkit-clip-path,我如何制作这种类型的戊酮,因为它不能像火狐、IE9这样的大多数浏览器工作。 我的代码: div { width: 150px; height: 150px; background: #1e90ff; -webkit-clip-path: polygon(0% 0%, 75% 0%, 100% 50%, 75% 100%, 0% 100%); clip-path: polygon(0% 0%, 75% 0%, 100% 50%, 75% 100%, 0% 100%); } /* Center the demo */ ht
浏览 5
提问于2015-01-01
得票数 11
回答已采纳
扫码
添加站长 进交流群
领取专属
10元无门槛券
手把手带您无忧上云
相关
资讯
在 iOS 版本的 Google Chrome 上测试 WebKit 替代品
谷歌希望在 iOS 上使用 Chrome Blink 引擎,以取代苹果的 WebKit
CSS3 clip-path 用法介绍
邻里生活节上,普陀这里的“四有”青年街区闪亮呈现
买不上测温枪的看这里
热门
标签
更多标签
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
活动推荐
运营活动
广告
关闭
领券