我注意到每个浏览器都以不同的方式呈现border-style: inset;属性，所以我有两个问题：
为什么浏览器会以不同方式呈现它？怎么会有这么多不同的算法呢？最重要的是，有些浏览器看起来有问题！
由于我不能依赖inset属性工作，我想知道适当的“算法”是什么？我通常在顶部/左侧打16个打火机，在底部/右侧打16个更暗（即。#666666是背景，因此#767676是顶部/左侧，#565656是底部/右侧）
我需要知道要使用什么（一般来说），因为我在制作样式插图时遇到了麻烦，我显然无法正确使用插图，所以我必须手动更改颜色。然而，有时它看起来并不正确（如果它太暗）。那里必须有一个很好的算法吗？
我已经在这个问题上寻找了网络资源（例如“你的边框需要什么颜色才能让这个看起来好看！”工具）或任何可能有用的东西，什么都没找到。
以这种方式思考：如果有人在绘画程序中制作某些内容并且没有插入效果按钮，那么它们的四个边框将是什么颜色，因为主要颜色是_____？
我无法找到一个通用的算法......
编辑：我想回到我使用需要插入样式的绘图程序的示例。有人可以给我一个他们用于此目的的例子吗？ （问题的这一部分是否更好地指向设计师堆栈？）
答案 0 :(得分：5)
引用： “1。为什么浏览器会以不同方式呈现它？”
我确信每个浏览器的表现都不同，因为他们认为他们看起来最好。 IE可能会在Windows中看起来很好看。 Safari正在使它们与Mac OS的外观保持一致。 Firefox与浏览器的其他元素等一致（和thirtydot所说的一样，它还没有标准化。）
引用： “2。由于我不能依赖inset属性工作，我想知道正确的'算法'是什么？” < / em>的
如果它很重要，你可以尝试对其进行逆向工程。设置测试页面并在浏览器中调用它。使用滴眼器/颜色选择器实用程序来挑选各种颜色。有了足够的样本，您应该能够找到该浏览器的模式。
引用： “这是我无法找到的通用算法......”
如果每个浏览器都以不同方式执行，则不会每个人都有自己的算法。
编辑以解决OP的后续行动：
引用： “编辑：我想回到我使用需要插图样式的绘画程序的示例。有人能举例说明他们的内容吗？ d用于此吗？（问题的这一部分是否更好地指向设计师堆栈？）“
您似乎在寻找一个不存在的具体答案。我不能给你一个我用过的例子，因为现代图形程序（Photoshop）会为我做这个，然后给我足够的选项，当合并时，字面上提供数百万的结果;边框颜色，高亮颜色，阴影颜色，深度，角度，厚度，轮廓等。问20个人他们认为什么是“完美”插图，你会得到20个不同的答案（意见真的）然后我们回到它在每个浏览器中看起来不同的原因（参见上面的＃1）。所以，是的，在“编程”问题的背景下，OP的最后一部分可能是偏离主题的。
其他随机想法：
为什么border-style没有标准化？恕我直言，我认为这个属性根本不足以保证标准化的任何重大努力，或者标准社区中对此有很多不同意见。我想所有需要标准化的CSS属性都会以某种方式（流行度，有用性？）进行优先排序，而这个属性还没有削减或者将每个人聚集在一起。就个人而言，我认为这样的房产与不断变化的趋势密切相关。即 - 10年前，我们曾经看到很多桌子都有很厚的“浮雕”边框。如今，许多设计使用很少的边框或非常薄的边框（如果有的话）。同样，这只是品味和观点的问题。
答案 1 :(得分：3)
我有一个答案：
- 为什么浏览器会以不同方式呈现它？怎么会有这么多 不同的算法呢？大多数 所有，有些浏览器看起来有问题！
请参阅： http://www.w3.org/TR/CSS21/box.html#border-style-properties
为值绘制的边框颜色 '凹槽'，'脊'，'插入'，和 'outset'取决于元素 边框颜色属性，但 UAs可能 选择自己的算法 计算使用的实际颜色。对于 例如，如果'border-color'有 价值'银'，那么UA可以 使用从白色到渐变的颜色 深灰色表示倾斜 边界。
这就是实现不同的原因 - 因为它没有标准化。
答案 2 :(得分：2)
我会说较轻的一面为每个rgb值增加20％，而对于黑暗面则从每个RGB值中删除20％..