7回答
我有这个脚本，应该在一个循环中显示这7个图标。我想让它看起来像手机正在充电，但它不起作用。如何将最后一个图标(assets/icons/ic_battery_charging_full_48px.svg)添加到循环中。
$(document).ready(function(){
var icons = [2,3,5,6,8,9];
function displayIcons() {
var i;
for (i = 0; i < icons.length; i++) {
sho
浏览 2提问于2014-11-15得票数 0
回答已采纳
1回答
我在寻找堆叠溢出的解决方案，但什么也没找到。我有一套图标。默认情况下，它们是灰色的，只有4/7是可见的。当我在带有图标的div上盘旋时，我希望7中的7是可见的和灰色的。在盘旋时，我希望每个单独的图标，也就是悬停的图标，用相同的不同颜色的图标进行更改(我对每个图标都有两个不同的SVGs -灰色和蓝色)。
.card-list .social span img {
height: 13px;
margin-top: -2px;
}
.card-list .social:hover>.hidden {
display: inline;
}
.card-list .socia
浏览 1提问于2018-10-12得票数 0
回答已采纳
在html中
<md-button class="md-fab md-primary" aria-label="Use Android">
<md-icon md-svg-src="img/icons/andriod.svg">
</md-icon></md-button>
在上面的html中，我使用角material.but向fab按钮添加了svg图像，不幸的是，它显示了一个错误，无法获取/img/图标/andriod.svg。我在同一个目录中指定了图标的路径，其中html是locat
浏览 5提问于2016-07-19得票数 1
回答已采纳
1回答
我有一个包含机场坐标的airports.json文件，并希望使用以下函数在地图上的每个坐标上附加一个airport.svg图标：
function draw_airports() {
d3.json('airports.json').then(function(airport_data) {
var svg = d3
.select('map_container')
.append('svg')
.attr('width', width)
.attr('heig
浏览 0提问于2020-02-03得票数 1
回答已采纳
1回答
我的资产文件夹中有一个名为"home.svg“的图标。如何将q-icon组件定向到assets/目录中的图标。
我试过这样做：
<q-icon name="img:/assets/home.svg" class="text-dark" style="font-size: 32px;" />
但是图像没有被渲染。
浏览 0提问于2020-08-15得票数 2
回答已采纳
我如何将这个重复的CSS转换成一个SASS列表，以便类(实际上中有50+类，而不是像这里这样的所有SVG图标)名称自动在背景-img: url属性中结束？
.boy{
background: url(../svg/boy.svg);
}
.car{
background: url(../svg/car.svg);
}
.house{
background: url(../svg/house.svg);
}
浏览 4提问于2016-05-06得票数 0
回答已采纳
我正在制作一个带有图标和文本的菜单，如下所示：
问题是，当我悬停在选项卡上时，我希望图标被“突出显示”，而不是停留在小图标上方。这就是现在发生的事情：
因此，我的问题是如何在一个元素上悬停(选项卡是div)，从而激活另一个元素(图标)的悬浮CSS。
这是图标的代码：(HTML)
<a href="#" class="menubutton">
<span id="playicon"></span> Servers
</a>
(CSS)
#playicon {
浏览 5提问于2013-08-18得票数 2
回答已采纳
我有一个Bootstrap网站，有这样的导航：
<a href="">
<div class="panel panel-default">
<div class="panel-body">
<img src="img/messages-grey.svg">
</div>
<div class="panel-footer panel-categories-footer-small">
Messa
浏览 4提问于2015-01-12得票数 0
回答已采纳
我正在使用带有节点/webpack的库，它工作得很好(功能/样式)，除了按钮的图像不出现。
我使用导入
import JSONEditor from 'jsoneditor';
import 'jsoneditor/dist/jsoneditor.css';
import 'jsoneditor/dist/img/jsoneditor-icons.svg';
在webpack的配置中，我尝试了使用svg的文件加载器以及David Bradshaw在中建议的内联svg加载器。
控制台中也没有错误消息。看起来这些图标是通过css文件加载的。和webp
浏览 5提问于2017-01-25得票数 0
回答已采纳
我是服务图标从icomoon.io到我的网页使用快递。目前，我正在将每个图标存储到不同的路由，但我是否可以一次使用同一条路径为所有图标服务？下面是我的node.js代码片段。
app.get('/icons', (req, res) => {
res.sendFile(path.join(__dirname+'/img/SVG/profile-male.svg'));
});
app.get('/icons/search', (req, res) => {
res.sendFile(path.join(__dirna
浏览 1提问于2022-04-16得票数 0
1回答
图标间距不一致
、、
function parseESG(cellvalue, options, rowObject){
var esgIcons = "";
var esgValues = rowObject.EsgPillar;
var esgArr;
if(typeof esgValues === 'string'){
esgArr = esgValues.split(",");
}
if(esgArr != undefined || esgArr != null){
浏览 6提问于2022-10-26得票数 0
1回答
我正在制作一个基于React的小应用程序，我试图包括一个放大镜图标SVG。然而，React一直抛出一个错误，我不确定如何继续。任何帮助都将不胜感激！ 错误： ./src/Header.js
SyntaxError: /Users/klaurtar/Desktop/React JS/trillo-project/src/Header.js: Namespace tags are not supported by default. React's JSX doesn't support namespace tags. You can turn on the 'throwI
浏览 11提问于2019-09-20得票数 0
1回答
这是Primeng页面上的组件模型
如果不可能，可以将Svg或Img转换为图标并将其放在样式中吗？以及如何将其与组件的样式相关联？
谢谢。
浏览 3提问于2021-01-07得票数 1
2回答
svg内部响应图像
、、、
TL;DR:是否有可能通过img标签从svg中加载其他基于媒体查询的图像？
我生成了一堆svg文件，其中有包含文本和图标的表格。PDF在语义上将是一个更好的容器，但是我需要保存像图像这样的“文档”，以便无缝地嵌入/预览，这可能解决不了我的问题。所以这个故事是关于图标的。
我使用媒体查询编写内联样式，选择与用户屏幕DPI对应的图标。图标已经绑定到精灵中，所以我使用pattern/image[xlink:href] + fill:url(#id)。当我将svg直接嵌入到HTML (DOM岛)中时，一切都可以根据需要工作。但是，如果我通过img标记(即<img src="foo.svg
浏览 0提问于2018-12-07得票数 0
回答已采纳
我正在尝试渲染自定义SVG图标，这些图标是为web设计和导出的。这些文件存储在本地的资源文件夹中。
使用此包
下面是我是如何使用图标的：
import MainLogo from '../../../assets/svg/logos/mainlogo.svg';
<img src={MainLogo} alt="" />
这是我从我的webpack配置中获得的片段
//SVG Icon Loader
{
test: /\.svg$/,
loader: 'svg-inline-loader'
浏览 1提问于2018-03-19得票数 0
问题是如下所示，采用svg文件格式：
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px">
<symbol id="gear" viewBox="0 0 300 300" enable-background="new 0 0 300 300" xml:space=
浏览 1提问于2017-05-17得票数 1
2回答
<img id="plusicondiv" class="rose" src="images/pluseicon.svg" />
<div id="plusicondivbox"class="insidediv " style="margin-top:-53px;" >
<img class="mynasicondi
浏览 1提问于2016-08-08得票数 1
回答已采纳
这只是一个快速的问题，我有一个自定义SVG图标。
我们已经为我们的一个客户使用了矢量图标集，并且我们正在使用他们网站上的图标。
我已经从illustrator输出了SVG，然后使用IMG标签链接到网站上。然而，这些图标渲染起来真的很奇怪。边缘看起来都摇摇晃晃的，并不是它们应该的样子。我已经粘贴了代码和网站上的图标截图。
有人知道怎么解决这个问题吗？
提前感谢！
<img src="/assets/images/misc/why-icon-1.svg" class="img-fluid img-center overlayImage"/>
.over
浏览 27提问于2021-05-20得票数 0
回答已采纳
1回答
网页中的SVG图标？
、、、
我正在写一个相当复杂，大和长寿(它可能会显示很多天)的网页，也将需要图标。这些图标应该是SVG图形。根据页面上的位置，SVG应该由JavaScript调用重新着色(jQuery，甚至jQuery都可以)。
所以我的问题是：
在网页中包含SVG的最好方法是什么？<img><object>jQuery(...).svg({loadUrl:...})...
如何将它们“乘”？在隐藏的clone()?Just和demand?上的预加载
设置SVG的最好方法是什么？(一个文件中的所有图标在不同的层上？)一个文件中的所有图标按位置分开？那么，每个icon?)What'
浏览 2提问于2012-05-17得票数 1
1回答
我是第一次接触帕格。我使用JSON文件来存储pug文件中使用的数据。这是我的数据结构：
{
"nav": {
"titles": [
"location",
"reservations",
"accomodations",
"amenities"
],
"icons": [
"img/sprite.svg#icon-location2",
"img/sprit
浏览 6提问于2018-01-29得票数 0
回答已采纳
3回答
我正在创建一个带有图标(svg图标)的导航栏。
使用Bootstrap 4实现此目标的最佳方法是什么？
这就是我想要的：
这是我实现的最接近的(没有给我的图标或链接一个固定的大小)是：
<div class="row justify-content-center">
<div class="col-sm-10">
<nav class="navbar d-flex align-items-end">
<a class="navba
浏览 0提问于2018-06-01得票数 0
我已经得到了一些rtf文件，这些文件将用于内联svg。我想在外部引用凹陷，但当我使用任何rtf到svg转换器时，它会将其转换为带有代码的凹陷图像。
在我尝试将其从rtf文件转换后，请参阅显示svg的屏幕截图。
有谁知道如何将rtf文件转换为svgs，以便在html中作为img src引用？
浏览 0提问于2016-10-25得票数 0
1回答
展开边栏时缺少背景色
、、、、
我想要创建一个边菜单，这是一个狭窄的右边边栏，在其中的图标在一个列。有可能有更多的图标/按钮，然后可用的垂直空间，我想要实现的是显示这些图标悬停在侧边栏和剩余的图标将扩大到左边！请运行片段进行演示。我的问题是，边栏上没有足够空间的图标被包装到一个新的列中，因为我应用了flex规则，而且这些规则是正确的，，但是这些元素不会有侧边栏的背景，即bad。我希望我的问题是清楚的。谢谢
.container {
width: 400px;
height: 200px;
background-color: grey;
display: flex;
flex-direction: r
浏览 5提问于2017-07-24得票数 0
1回答
我在React中上传SVG图标时遇到了问题。我给webpack添加了svg-inline-loader，但是它没有显示图标。它只显示未找到的图片。我想添加SVG图标作为img源，背景图像和快捷方式图标。
编辑：
这是我的webpack.config
module.exports = {
entry: ["whatwg-fetch", "./js/app.jsx"],
output: {
filename: "./js/out.js"
},
devServer: {
inline: true,
contentBase: &#
浏览 0提问于2018-04-11得票数 0
我已经在很多项目中使用过fancybox。通常我从图像拇指触发图像弹出屏幕，但现在我必须从img类中的SVG图标触发它。Fancybox获取图标并将其显示在右侧拇指列表中。它应该显示来自具有data-fancybox属性的标签的实际图像。 ? ? 以下是使用图像缩略图作为弹出触发器时的正常工作方式： <a href="image.jpg" data-fancybox="gallery">
<img class="thumb" src="image.jpg">
</a> 这将产生预
浏览 45提问于2020-10-08得票数 0
1回答
我在我的中使用一些来自<img>的SVG图标作为<img>元素。
<img src="svg/Entypo+ Social Extension/twitter-with-circle.svg"></img>
是否可以使用CSS更改此图标的颜色？还是我需要编辑SVG本身？
浏览 4提问于2017-11-03得票数 1
回答已采纳
1回答
我很难弄清楚如何调用保存在单个svg图像中的图标，首先我想了解坐标是如何工作的，我的意思是如何将大图像中的某个图标调用到像<img>这样的html元素，我在某处读到，如果你已经设置了这样的<view>元素，有一种方法可以用名称来调用这些图标：
<view id="icon-heart-view" viewBox="0 32 32 32" />
<img src="icons.svg#icon-heart-view" alt="Heart">
但我不明白它们是如何加载到页面上的，而只调
浏览 1提问于2015-11-15得票数 0
我正在使用OpenWeather应用编程接口在我客户的网站上显示当前和五天的预测。
我有一些自定义的SVG图标，我想使用它们来代替OpenWeather提供的图标。我已经实现了以下switch语句，以根据天气条件显示不同的图标。
let dailyCondition = value.weather[0].description;
let dailyCondtionIcon = "";
switch (dailyCondition) {
case "clear sky":
dailyConditionIcon = `<svg>ic
浏览 6提问于2021-12-02得票数 0
我正在拼命寻找一个解决方案，为什么Chrome可以正确地显示我的svg图标(以正确的颜色)，而Safari不能。
任何改进或提示都是值得感谢的。
如果我的问题还有什么不清楚的地方，请询问
谢谢!
Script for transforming svg into inline svg
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript&
浏览 0提问于2018-01-12得票数 0
如何在Swift中用代码更改SVG的2种不同颜色？SVG图标由一个箭头和一个圆圈组成。我想把箭头的颜色和圆圈的颜色分开。我能用斯威夫特吗？
通过使用这段代码，我可以将轮盘图标的颜色设置为蓝色。
let palyImage = UIIImage(name: "play").withRenderingMode(.alwaysTemplate)
playImageView.image = playImage
playImageView.tintColor = .systemBlue
如何将另一种颜色应用到相同的图标上，使图标有2种不同的颜色？
我没有设法谷歌任何建议，我可以改变两种不
浏览 5提问于2021-08-08得票数 1
回答已采纳
我有下面的设置，而且它正在工作。
import * as Icon1 from 'images/img1.svg'
import * as Icon2 from 'images/img2.svg'
const Foo = () => {
return (<>
<AComponent icon={Icon1}/>
</>)
}
现在的任务是从字符串值动态地确定图标，所以我尝试：
import * as Icon1 from 'images/img1.svg'
import
浏览 1提问于2022-07-05得票数 0
回答已采纳
1回答
需要说明的是，我绝对不是一个很好的图形人员……但我需要一些数字图标，而在整个IcoMoon中，我只能找到一组：。问题是，我期待的是一个CSS表格，或者一些我可以下载然后引用的东西，比如Bootstrap字形图标，例如<span class="glyphicon glyphicon-name"></span>。此设置以PSD文件的形式下载。老实说，我不知道下一步该怎么走...
如果我导入一个SVG文件，似乎我可以使用IcoMoon生成图标，但我不知道如何将PSD文件项转换为SVG文件(我尝试将一个单独复制到新画布，但不能另存为SVG )。感谢任何人的帮助！
浏览 9提问于2016-08-13得票数 0
2回答
SVG相互覆盖CSS样式
、、、
我正在与Vue.js合作，并尝试在我的网页应用程序中放置一些我在Illustrator中制作的SVG图标。我加载了带有Webpack "require“的图标。不可能访问svg的源代码( img标记的src属性)，所以我们用vue插入它们，如下所示：
<div class="section-icon" v-html="getIconForEvent(event)"></div>
这会在正确的位置显示正确的图标，但我在使用这种方法时遇到了一些问题。
svgs都是在svg中使用style-tag设置样式的。因此，最后一个SVG覆盖了以
浏览 1提问于2018-08-07得票数 5
创建了一个手风琴为基础的下拉菜单的移动导航。
当用户单击"li“时，它必须添加类"active”来标记。这个很好用。
此外，它必须将图标改为“白色”，而不是“灰色”
当用户单击现有的“活动”或其他"li“时，图标必须更改为”灰色“图像，而不是”白色“->不能工作。
下面是我用来解决这个问题的代码，但是我无法找到解决方案。
HTML:
<ul class="menu-accordion">
<li>
<a href="#"><img class=&#
浏览 2提问于2016-06-13得票数 0
回答已采纳
我有一个没有背景的Twitter svg图标：
<img id = "twitter_icon" src = "pictures/twitter.svg" alt = "Nema">
#twitter_icon {
background-color: aqua;
}
当我给它添加背景色时，它会填满整个图标和周围的正方形空间。有没有办法填充图标，这样颜色就不会离开图标的边框？
都会对你的回答表示感谢。
浏览 5提问于2020-11-21得票数 0
2回答
在下面的代码中，如果我在flex列中注释掉align-items行，背景是灰色的，图标之间存在空间。如果我取消评论align-items，背景是蓝色的，图标集中在一起。
我认为align-items和justify-content是相互正交的--为什么align-items会影响子柔箱容器中的挠曲盒间距问题？宽度不是从100%开始吗？
我认为它只会管理它的直接子女。此外，当align-items处于活动状态时，整个区域都是蓝色的，难道我不应该至少看到图标的背景是灰色的吗？
.flex-column {
display: flex;
flex-direction: column;
浏览 1提问于2018-01-25得票数 1
回答已采纳
2回答
我有一个SVG格式的图标列表，我正在使用的web应用程序。
图标前景颜色是黑色，我想使用CSS将此颜色更改为白色时，徘徊在上面。使用CSS (如果可能的话)最简单的方法是什么？
HTML标记如下：
<img class="icon" src="user.svg">
CSS
.icon {
width: 200px;
height: auto;
}
.icon:hover {
fill: #fff; /* this doesn't work */
}
浏览 6提问于2017-05-15得票数 1
回答已采纳
1回答
我有两个SVG图标在我的资产文件夹和我有一个用户输入框在我的HTML。我希望第一个图标显示为默认，但当用户开始输入文本框时，我希望第二个图标显示。我很难实现这个目标。
有相同的搜索图标，但第一个图标只是简单的白色和第二个图标是teal颜色。
默认图标=搜索放大镜图标.
当用户开始键入=搜索-放大镜-玻璃图标时，请更改此选项。
我不确定是否有其他方法直接更改SVG图标的笔画颜色，而不是在资产文件夹中有两个图标，但这是目前的代码。
HTML
<mat-form-field appearance="fill" style="width: 380px;&
浏览 1提问于2020-04-09得票数 0
回答已采纳
2回答
我有以下CSS：
.dropdown section h4::after {
content: url(img/plus-symbol.svg);
right: 0;
vertical-align: middle;
position: absolute;
display: inline-block;
}
有人能给我一点提示吗?在最后一个项目中，如何将"+“图标带到中间？
浏览 2提问于2017-12-26得票数 0
回答已采纳
我遇到了麻烦，将自定义SVG图标添加到WordPress的“社会图标”菜单中十七子Theme.The菜单工作正常，所有预先打包的SVGs包括在主题，但我不能添加自定义SVGs到子主题。
下面是我到目前为止在社交图标菜单中添加"Etsy“SVG所做的工作：
将/assets/img/svg-icons.svg文件复制到子主题中
使用所有其他图标将Etsy SVG路径粘贴到svg-icons.svg文件中
📷
将/inc/icon-functions.php文件复制到子主题中
将“etsy.com”添加到社交媒体网站的数组中
📷
然后我在子主题的/inc/icon-functions.ph
浏览 0提问于2019-08-21得票数 0
回答已采纳
现在，当我删除时，svg图标位于div.video-open-container的中心。如何将svg放在img标签上，不需要移除div包装器就可以实现？
.video-open-container {
display: flex;
justify-content: center;
}
svg {
position: relative;
width: 64px;
height: 64px;
transform: translate(-50%, -50%);
}
<div class="details">
<img class=&
浏览 0提问于2018-07-01得票数 1
微软文档指出，您可以使用SVG矢量图形文件设置图标：
但是，当我尝试使用svg文件设置图标时，它只显示为空白：
<AppBarButton Label="BitmapIcon">
<AppBarButton.Icon>
<BitmapIcon UriSource="ms-appx:///Svg/MyButton.svg"/>
</AppBarButton.Icon>
</AppBarButton>
这就是我如何将Svg文件添加到我的项目中:在项目下，我创建了一个目录
浏览 0提问于2018-05-22得票数 6
1回答
注意:这是我的第一篇代码评论文章，所以任何关于其他信息的反馈(如果有的话)都会非常感谢！
。
反应组分: Social.js
该组件有4个属性的输入：
暗:布尔值-如果提供黑暗，则该组件呈现白色图标，以与深色背景进行对比。
如果提供了facebook url，组件就会呈现facebook图标，否则根本没有图标。
如果提供了twitter url，组件就会呈现twitter图标，否则根本没有图标。
如果提供了instagram url，组件就会呈现instagram图标，否则根本没有图标。
如果只提供了一个社交媒体url，则文本“跟我们在：”将与单个图标
一起呈现。
let count = 0;
浏览 0提问于2021-03-16得票数 1
我有这些社交媒体图标，除了最后一个图标之外，我想对每个图标都应用一个边距，问题是当我使用:not(:last-child)时，它没有工作，它什么也没做。下面是HTML和CSS代码：
<div class="icons">
<a href="#"><img class="social-media-icon" src="../images/icon-facebook.svg" alt=""></a>
<a hr
浏览 6提问于2022-09-03得票数 0
我有一个带图标的按钮，它的源是一个大约4kb的SVG。当我将鼠标悬停在按钮上时，我希望图标的颜色反转，从黑色变为白色。要达到这个效果，最好是像这样使用CSS：
#btn:hover #icon-img {
-webkit-filter: invert(1);
filter: invert(1);
}
...or是否更好(例如，更快/最佳实践/更好的内存)直接操作图像源，并添加一个白色版本的图标，如下所示？
document.getElementById('btn').addEventListener('mouseover', (e) =>
浏览 0提问于2017-03-30得票数 0
我正在尝试动态加载图像，这些图像可能存在也可能不存在。
在这种情况下，密码货币图标使用他们的3个字母符号.我的静态库中有几百个.svg格式，当我从价格服务器中提取数据时，我试图将我拥有的图标与来自服务器的符号匹配起来，如果我没有该资产，我将提供一个备用图像。
在我的index.vue中，我可以不使用这些代码，一切都很好：
<img :src="'statics/icons/svg/' + coin.symbol + '.svg'" v-img-fallback="'statics/icons/svg/fallback.svg
浏览 0提问于2018-04-04得票数 6
回答已采纳
2回答
当用户单击settings.svg图标时，我创建了一个onclick下拉菜单。
当前，当用户悬停在此设置图标上时，图标上的不透明度将从0.3 (默认不透明度)更改为0.5。
我正在努力扩大这种行为。当用户单击设置图标时，其不透明度应从0.3更改为0.5。它应该保持这个0.5的不透明度，直到用户再次单击图标本身或在页面的其他地方-返回到0.3。
任何帮助都会很好-谢谢！
application.html.erb
<ul class="navigation-bar">
<div class="navigation-bar-right-inset"
浏览 3提问于2016-03-15得票数 1
2回答
如何将图标作为图像添加到表中？
<th class="px-1 py-2 font-medium text-jibuttonBlue text-left">
<div class="">
Date
<img src="{{MEDIA_UI}}/icon-filter-table-column-selected.svg" alt="">
</div>
</th>
但是控制台甚至没有显示有一个div。我不能在
浏览 2提问于2020-09-07得票数 1
回答已采纳
1回答
在这里，我想显示的边界颜色的图像图标点击。我有3个图像，它有默认的边框设置。我正在寻找显示图标边框的颜色点击喜欢切换每个图标。这是
.img-border {
padding:5px;
border:1px solid #db9c31;
// background-color:#ff0;
}
<div class="row header">
<div class="col-3">
<a class="align-middle no-pa
浏览 1提问于2019-02-02得票数 1
回答已采纳
我目前有八个图标，当用户单击单个图标时，会添加一个活动类。用户还可以使用下一个和以前的按钮来触发下一个和以前的类。
问题是，当用户选择其中一个图标，然后使用下一个或以前的按钮时，函数不知道哪个是当前选定的图标，然后从图标列表的开始单击。
任何帮助/建议都是有帮助的。
JS
$(".result-icons li").click(function() {
if (!$(this).hasClass("active")) {
$(".result-icons li.active").removeClass("activ
浏览 5提问于2016-07-05得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
