在我们的一个网络应用程序中，我们需要允许用户生成一个“按钮”，他们可以将其放置在他们的网站上，将用户引导至我们的应用程序。这个想法听起来很简单，但我想得越多，我不确定实现这一目标的最佳途径是什么。我想出的一个选择是围绕托管在我们服务器上的图像生成超链接，例如:
<a href="/location/on/our/application">
<img src="//ourapp.com/images/button-image.jpg" />
</a>
我们的应用程序使用 Bootstrap ，而我们真正需要的只是一个基本的 Bootstrap 按钮。像这样的东西:
<a class="btn btn-primary" href="/location/on/our/application">To Our App</a>
但是，当客户端站点没有使用 bootstrap 框架时，这显然不会达到预期的效果。
我一直避免使用 iframe，但这是可以接受使用 iframe 的例子吗？还有其他我忽略的选项吗？
最佳答案
如果您选择沿用 CSS 按钮的路线，我会推荐内联样式。考虑到您不知道外部网站使用的是什么样式表，您需要捆绑自己的样式，而内联样式非常适合这一点。他们有第二高的水平 specificity ，仅次于 !important declaration 。需要注意的重要一点是，您实际上可以组合 !important使用内联样式:
<div style="display: block !important;"></div>
这不能以任何方式被覆盖，并且保证按预期显示...假设外部网站开发人员遵守这些规则，并且不修改您提供给他们的 HTML/CSS(您不能放心)。
因此，图像将是最好的解决方案，因为外部网站的所有者不能进行任何“扭曲”；图片要么被完全替换，要么没有。
最终，除了品牌形象保护，您真正需要担心的是 href attribute 仍然指向您的网站(连同通过任何必需的 query strings )。只要它有效，就转化率或您可能感兴趣的任何其他指标而言，链接与完整按钮一样有效。
希望对您有所帮助! :)
关于html - 生成供外部站点使用的样式化元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47762197/