个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我正在制作一个应用程序，我想要一个响应式 SVG 进度条。我的代码在下面，但进度条没有响应。如何实现响应能力？
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<svg version="1.1" height="200" width="850" y="0" x="0">
<g>
<defs>
<linearGradient spreadMethod="reflect" y2="0%" x2="100%" y1="0%" x1="0%" id="myLinearGradient3">
<stop stop-opacity="1" stop-color="#D7565A" offset="10%"/>
<stop stop-opacity="1" stop-color="#E58E5F" offset="25%"/>
<stop stop-opacity="1" stop-color="#E58E5F" offset="26%"/>
<stop stop-opacity="1" stop-color="#EAEAEA" offset="57%"/>
<stop stop-opacity="1" stop-color="#FFF34D" offset="58%"/>
<stop stop-opacity="1" stop-color="#EAEAEA" offset="77%"/>
<stop stop-opacity="1" stop-color="#4dd4ff" offset="78%"/>
</linearGradient>
</defs>
<!-- Gradient table -->
<rect style="fill:url(#myLinearGradient3); stroke: #8D99A6; stroke-width: 0.5;" ry="10" rx="10" height="20" width="800" y="100" x="25"/>
</g>
<!-- Ruler -->
<!-- ballons -->
<g>
<text text-anchor="start" font-size="11" font-weight="bold" font-family="Gotham-Book" stroke-width="1" fill="#000000" y="137" x="45">(++)</text>
<text text-anchor="start" font-size="11" font-weight="bold" font-family="Gotham-Book" stroke-width="1" fill="#000000" y="137" x="795">(--)</text>
<text text-anchor="start" font-size="10" font-weight="normal" font-family="Gotham-Book" stroke-width="1" fill="#8B97A3" y="95" x="40">DEFICIENT</text>
<text text-anchor="start" font-size="10" font-weight="normal" font-family="Gotham-Book" stroke-width="1" fill="#8B97A3" y="95" x="255">SUB-NORMAL</text>
<text text-anchor="start" font-size="10" font-weight="normal" font-family="Gotham-Book" stroke-width="1" fill="#8B97A3" y="95" x="445">NORMAL</text>
<!-- movable vertical lines : user exact value with ballon -->
<!-- line 1 -->
</g>
</svg>
</body>
</html>最佳答案
您将使用 viewBox 来创建响应式 SVG。我也将高度和宽度设为 100%。
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<svg height="100%" width="100%" viewBox="0 0 1000 4000" preserveAspectRatio="none">
<g>
<defs>
<linearGradient spreadMethod="reflect" y2="0%" x2="100%" y1="0%" x1="0%" id="myLinearGradient3">
<stop stop-opacity="1" stop-color="#D7565A" offset="10%"/>
<stop stop-opacity="1" stop-color="#E58E5F" offset="25%"/>
<stop stop-opacity="1" stop-color="#E58E5F" offset="26%"/>
<stop stop-opacity="1" stop-color="#EAEAEA" offset="57%"/>
<stop stop-opacity="1" stop-color="#FFF34D" offset="58%"/>
<stop stop-opacity="1" stop-color="#EAEAEA" offset="77%"/>
<stop stop-opacity="1" stop-color="#4dd4ff" offset="78%"/>
</linearGradient>
</defs>
<!-- Gradient table -->
<rect style="fill:url(#myLinearGradient3); stroke: #8D99A6; stroke-width: 0.5;" ry="10" rx="10" height="20" width="800" y="100" x="25"/>
</g>
<!-- Ruler -->
<!-- ballons -->
<g>
<text text-anchor="start" font-size="11" font-weight="bold" font-family="Gotham-Book" stroke-width="1" fill="#000000" y="137" x="45">(++)</text>
<text text-anchor="start" font-size="11" font-weight="bold" font-family="Gotham-Book" stroke-width="1" fill="#000000" y="137" x="795">(--)</text>
<text text-anchor="start" font-size="10" font-weight="normal" font-family="Gotham-Book" stroke-width="1" fill="#8B97A3" y="95" x="40">DEFICIENT</text>
<text text-anchor="start" font-size="10" font-weight="normal" font-family="Gotham-Book" stroke-width="1" fill="#8B97A3" y="95" x="255">SUB-NORMAL</text>
<text text-anchor="start" font-size="10" font-weight="normal" font-family="Gotham-Book" stroke-width="1" fill="#8B97A3" y="95" x="445">NORMAL</text>
<!-- movable vertical lines : user exact value with ballon -->
<!-- line 1 -->
</g>
</svg>
</body>
</html>关于javascript - 如何为 Web 和移动设备制作 SVG 响应式进度条？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34491509/
25
4
0
我有一个几乎可以构建的Maven / Grails应用，但在web.xml上找不到[my-app]\webapp\WEB-INF\web.xml。但是目录结构像往常一样包含web-app文件夹，而不是
正如我在标题中提到的:我想知道 web-service 和 web-socket 之间的区别？我们什么时候使用每一个？ 谢谢! 最佳答案 一个web service是一个响应客户端 SOAP/REST
让我们看一个示例场景: 客户端打开一个网站并找到他从文本框中输入的两个数字的总和。然后单击“添加”按钮。两个参数通过 HTTP GET 发送到服务器，在服务器上写入 PHP 代码以添加数字，结果为回声
我知道这是一个老问题，肯定已经被回答了数百次，但我还无法找到令人满意的答案。 我正在创建一个应用程序，其他应用程序(移动/网络)将使用该应用程序来获取数据。现在我有两个选择: 将我的应用程序创建为简单
通过 Web 作业部署新功能有 3 种方法: 创建一个新的 Web 应用，并部署一个包含该函数的 Web 作业。 向现有 Web 作业添加一项新函数(这样您现在在一个 Web 作业中就拥有了多个函数)
我收到来自网络场景的通知，上面写着“问题”和“确定”。我想在问题发生时包含网络响应的内容。我不担心标题值，只担心网页的内容. 这是我可以在通知设置中引用的变量吗？ 最佳答案 不幸的是 zabbix 不
就目前而言，这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持，但这个问题可能会引起辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the he
嗨，这是一个理论问题，但我真的无法弄清楚 Web 应用程序、基于 Web 的应用程序和基于云的应用程序之间的区别。这个你能帮我吗。 最佳答案 @Matt 是对的 - 这真的无关紧要，但是，为了清楚起见
我正在尝试使用多个 Web 服务，这些服务在它们的 wsdl 中重新定义了一些相同的公共(public)类。我目前在网站中引用了它们，但我想转换为 Web 应用程序。 由于一些相同的类是从多个 Web
一个。我必须考虑哪些事项？b.当前应用程序正在执行多个存储过程。如果我创建等效的方法来执行这些过程，会有什么风险或挑战。 最佳答案 在架构上，将网络应用程序转换为网络服务时必须考虑的一件事是，对方法和
关闭。这个问题不满足Stack Overflow guidelines .它目前不接受答案。 想改善这个问题吗？更新问题，使其成为 on-topic对于堆栈溢出。 5年前关闭。 Improve thi
网络 API 和网络服务之间有什么区别吗？或者它们是同一个吗？ 最佳答案 网络服务通常提供 WSDL您可以从中自动创建客户端 stub 。 Web 服务基于 SOAP protocol 。ASP.NE
我已经获得了我需要的所有资源。我将 Web 服务放入应用程序服务环境中，然后将 NSG 连接到应用程序服务环境使用的子网。然后，我允许 VNET 内的应用程序与 Web 服务进行通信，但它无法正常工作
我已经获得了我需要的所有资源。我将 Web 服务放入应用程序服务环境中，然后将 NSG 连接到应用程序服务环境使用的子网。然后，我允许 VNET 内的应用程序与 Web 服务进行通信，但它无法正常工作
我正在使用 stub 将我的网络服务相关测试与实际网络服务隔离开来。 你/我应该如何合并测试以确保我制作的响应与实际的网络服务匹配(我无法控制它)？ 我不想知道怎么做，而是何时何地？ 我应该为测试数据
我在互联网上搜索了很多，但我仍然没有得到网络服务和网络 API 之间的明显区别？我在某处读到所有 Web 服务都是 API，但所有 API 都不是 Web 服务。如何？ 我所知道的是两者都允许利用其他
假设我已经完成了使用 JavaEE 制作的 Web 应用程序。这个 Web 应用程序包含登录系统，但最后它是非常基本的 Web 应用程序。我使用的是 GlassFish 3.1.2.2。 我想知道一旦
我希望设计者能够打开与我相同的解决方案文件。这可以通过 Expressions Web 实现吗？ 最佳答案 简短的回答是“不”；但这是一个非常常见的请求，我知道很多人都希望下一个版本(无论何时)对此有
我正在尝试在 CF10 中创建一个 Web 服务对象。我已验证它在 SoapUI 中按预期工作。但是，当我在 CF 中运行它时，我得到一个错误，它无法找到在 WSDL 的导入语句中导入的 XSD。这是
我的要求是开发一个 Web 服务，充当外部 Web 服务和客户端之间的中间人。 我知道，我可以为我的服务设计一个wsdl，然后将外部wsdl映射到代码中我的wsdl。我的问题是有一个开源 api/工具
我是一名优秀的程序员,十分优秀！