css3_编程技术问答社区_程序员问答知识库

以下是关于 css3 的编程技术问答

我想通过 CSS 将阴影过滤器应用于内联放置的 SVG 内的特定元素/路径，我不需要需要对整个图形进行阴影处理，只需一个元素在里面. .shadow { fill: red; -webkit-filter: drop-shadow( 3px 3px 2px rgba(0,0,0,.7) ); filter: drop-shadow( 3px 3px 2px rgba(0,0,0,.7) ); } 正如

260 2022-07-19 编程技术问答社区 css css3 svg svg-filters

我想使用 CSS 来创建漂亮的圆形边框.我知道以下 CSS 样式: border-radius -webkit-border-radius -moz-border-radius 哪种风格最好用? 解决方案 /* Gecko browsers */ -moz-border-radius: 5px; /* Webkit browsers */ -webkit-border-radius: 5px; /* W3C syntax - likely to be standard so use for future proofing */ border-radius: 5px; Internet Explorer 6 和7 和 8(据我所知)和 Opera 不支持圆角.相反，这些用户会看到一个常规角落. 您可以开始使用 Firefox 和任何“Mozilla"系列浏览器.Apple 的 WebKit 网络浏览器引擎还支持圆角，使其在 Safari 和 Chrome 网络

254 2022-07-19 编程技术问答社区 css css3

为什么在Firefox中，百分比padding/margin对flex项目不起作用？

我想在 flexbox 中有一个方形 div.所以我使用: .outer { display: flex; width: 100%; background: blue; } .inner { width: 50%; background: yellow; padding-bottom: 50%; } hehe 这在 Chrome 中运行良好.但在 Firefox 中，父级只压缩到一行. 如何在 Firefox 中解决这个问题?我使用的是 44 版. 您也可以在 https://jsbin.com/lakoxi/edit?html 查看代码,css 解决方案来自 flexbox 规范: 作者应完全避免在弹性项目的填充或边距中使用百分比，因为它们会在不同的浏览器中得到不

160 2022-07-19 编程技术问答社区 html css css3 firefox flexbox

在Firefox和IE11中，绝对定位的柔性项目没有从正常流程中移除

我们有两个带有内容的 div 和第三个带有绝对位置的背景的 div. 容器是一个弹性盒子. 在 Chrome 和 Safari 中一切正常，但 Firefox 和 IE11 计算绝对定位的 div，并在 div 之间分配空间，就像连续 3 个 div 一样. 我制作了 jsfiddle 示例.有没有办法修复这个错误?https://jsfiddle.net/s18do03e/2/ div.container { display: flex; flex-direction: row; width: 100%; height: 300px; justify-content: space-between; width: 100%; outline: 1px solid; } div.c1 { background: #aaeecc; width: 100px; position: relative;

208 2022-07-19 编程技术问答社区 html css css3 firefox flexbox

css3 - css flex 子元素居中

明显黄色小标标没有在中间 .box1 { display: flex; width: 300px; height:300px; background: #dedede; border-radius: 5px; padding: 10px; margin: 10px; } .item1 { width: 50px; height: 50px; background: orange; border-radius: 3px; } .item1:nth-child(2) { align-self: center; }

120 2022-07-19 编程技术问答社区 flex css3

css - html 有序列表ol 左边如何做到所有设备对齐？

如上图，代码结构如下每天打卡时间2小时内打卡为连续天数 21天内中断继续完成剩余天数，也算完成一个活动周期，但不算完成一个连续周期。参加活动即有机会赢取自拍神器、手机话费等好礼！如何吧左边序号包含在区域内？最兼容的做法是什么？

224 2022-07-19 编程技术问答社区 css css3 html html5

javascript - 這種版型要怎麼做？

想問問這種版型要怎麼做呢就是左邊一個區塊右邊也是一個滿版的區塊能夠隨螢幕大小自行變化（但左邊區塊不變）補上我自己的程式碼 .div_left { background-color:#2E3C54; width:12%; height:100vh; display:inline-block; } .div_right { background-color:#eee; width:80%; height:100vh; display:inline-block; } 完全不對...

58 2022-07-19 编程技术问答社区 css3 css html5 jquery javascript

javascript - 如何解决html5滚动模态框的时候会出现滚动条？

我使用的是jquery-weui的popup组件，但是弹出来的时候只要拖动模态框就会出现滚动条，这个怎么解决？在线等

184 2022-07-19 编程技术问答社区 css3 javascript weui html5

css - google santa 網站設計問題

问题 https://santatracker.google.c... 想問一下谷歌聖誕老人網站的做法？他的背景不會隨著瀏覽器放大或縮小當在1920x1080環境下瀏覽跟筆電size大小下瀏覽他能夠達成定位的行為這該怎麼做到？？我現在卡在這裡定位... 解决方案以解決。以解決。以解決。

116 2022-07-19 编程技术问答社区 css3动画 css css3 html5 google

javascript - google santa loading如何做

问题 https://santatracker.google.c... 想請問這個功能進去主頁前會有一條讀取線，當讀取完成後直接在顯示主頁這樣怎麼做呢？真的loading 不是假loading 解决方案以解決以解決。以解決。

190 2022-07-19 编程技术问答社区 google jquery javascript css3动画 css3

javascript - 子div的内容超出了父div的高度，然而父div不能自适应，设置min-height也没用

第一种解决方案是:有一种方法是加载完成后将子div的高度赋值给父级DIV，请问有没有其他方案？

340 2022-07-19 编程技术问答社区 php javascript jquery css3 html5

html5 - 这种动效是如何做出来的?

近年看了很多这种动效,感觉用于web或软件上都是非常赞的效果.事实上,诸如UC之类的安装效果现在都是这样的动效开场. 那么,它们一般是如何实现的呢?前端很多人说用AE,难道没有更简便的方法吗? 假如AE的话,达成这样的效果对小白而言需要多久?

318 2022-07-19 编程技术问答社区 after-effects css3 html5 animation ui

css - DIV 讓數字水平垂直置中？

.unsolve { position: absolute; right: 10px; top:50%; transform: translate(0,-50%); z-index: 1; font-size: 13px; background-color: red; border-radius: 50%; color:#fff; width: 15px; height: 15px; padding: 5px; text-align: center; } 12 這樣設定的時候，數字都會中間偏下，沒辦法完全中間。請問該怎麼讓他完全水平垂直置中？

154 2022-07-19 编程技术问答社区 css css3 html html5

css3 - css小三角定位

文字 .triangle-down { width: 0; height: 0; border-left: 0.4rem solid transparent; border-right: 0.4rem solid transparent; border-top: 0.6rem solid darkgray; } 怎么把小三角的位置调整到文字后面

106 2022-07-19 编程技术问答社区 css3 css

不知道为什么flex | grow。1在我的列式布局中不起作用

我试图让 views-cntnr 占用 views-cntnr 和 menubar divs。为了实现这一点，我有一个flex显示设置为列方向。然后我将 views-cntnr 的 flex-grow 属性设置为1.看起来没有做任何事情。 JSFiddle 注意：不确定是否但是我有一些嵌套的flex显示。 HTML

198 2022-07-19 编程技术问答社区 html css css3 flexbox

当我用电脑和iPhone看时，我怎样才能使宽度达到100%呢？

我的布局中有一张桌子.我也在使用 bootstrap 的响应式设计. 我想知道如何根据我正在使用的设备扩展其宽度. 例如，在我的电脑上，我的网站通常以大约 1200 像素的宽度显示. 在我的 iPhone 上，我的网站通常以大约 640 像素的分辨率显示. 我想尽可能地扩大气泡的宽度(我的意思是 100% 宽度)气泡的宽度应该是灵活的.缩小窗口的宽度应使其自动调整大小. 我该怎么办? 演示 http://jsfiddle.net/8ASj4/ HTML Body 01-10 03:29：Per

134 2022-07-19 编程技术问答社区 html css css3

悬停在菜单下拉菜单上 | 如何使悬停效果不消失？

我的菜单及其悬停效果存在严重问题. 我有一个非常基本的菜单，其中有一个子菜单: Menu1 Menu2 SubMenu1 SubMenu2 Menu3 这是我正在使用的 CSS: #menu li { display: inline; } #menu li a { padding: 10px; } #menu li a:hover { background: #000; } #menu ul ul { display: none; } #menu ul li:hover > ul { display: blo

980 2022-07-19 编程技术问答社区 html css css3

透明背景的Webkit模糊

在 CSS3 中，我可以很容易地用这个来模糊任何东西: -webkit-filter: blur(5px); -moz-filter: ... 现在，我正在尝试在文本顶部创建一个可拖动的圆圈，以便该圆圈区域内的任何内容都将被模糊: position:absolute; -webkit-filter: blur(3px); background: rgba(255, 255, 255, .3); 这在技术上应该可行，但这是我所看到的: 看起来有bug，最重要的是半透明圆圈内的文字没有模糊.有没有办法用 CSS 或 JavaScript 修复它? 示例:http://jsfiddle.net/hSpHd/ 解决方案问题是不支持屏蔽过滤器.也就是说，过滤器应用于所有元素.此限制的一种解决方法是拥有 2 个元素，将过滤器应用于一个元素，并将其屏蔽为透明度.然后您将显示第二个(相同的)元素，未过滤. CSS 将是: #one, #two { pos

194 2022-07-19 编程技术问答社区 javascript css html5 css3

同一行中的两个div，其中一个div中的文本根据第二个div的宽度被剪切。

我想在一行中有两个div，左div的文本基于右div的宽度（div中的文本是动态生成的）被裁剪，因此我们不能固定这些div的宽度右div必须完全可见，而左div中的文本可以剪切）。此图显示了示例输出：这里是小提琴： http://jsfiddle.net/UzqLZ/1/ 这里是代码的html部分：此文本必须隐藏，如果它是溢出 88818888.333346 有人可以帮我。您需要在文本周围添加一个内部包装元素，如下所示：如果溢出，则此文本必须被隐藏

98 2022-07-19 编程技术问答社区 html css html5 css3

清除掉:target CSS伪装类

最近我一直在制作 Shower HTML5+CSS3 演示模板，以制作即将发布的演示文稿.Shower 使用 CSS :target 伪类可以轻松识别当前幻灯片幻灯片概览. 我了解 :target 如何通过 URL 中的哈希工作，但是我无法让它从所有元素中清除 :target CSS. 所以我的问题是:考虑到元素被 :target 编辑后，我们如何清除所有 :target 并使用 JavaScript 将其恢复为规范?History API 的使用似乎不起作用. 解决方案我之前尝试过以下两种说法，但没有成功(至少在 Firefox 上): history.pushState({}, 'null', window.location.pathname); window.location.href.substr(0, window.location.href.indexOf('#')); 诀窍是改用这个: window.location.hash = '';

120 2022-07-19 编程技术问答社区 javascript css html5 css3 pseudo-class

首页
<
1
2
3
4
5
6
7
8
>
尾页