Fatal编程技术网
  • html/
  • 有没有显示椭圆或圆角矩形的HTML代码？

有没有显示椭圆或圆角矩形的HTML代码？

html graphics

有没有显示椭圆或圆角矩形的HTML代码？,html,graphics,rounded-corners,ellipse,Html,Graphics,Rounded Corners,Ellipse,我不确定是否可以在HTML中使用，但我仍然会在这里问： 是否有代表椭圆或圆角矩形的HTML代码？是的，画布。但它实际上是canvasHTML标记，加上Javascript。在这里阅读更多关于画布的信息。没有。如果您使用HTML和CSS，您可以做到这一点。如果您不介意使用特定于浏览器的CSS，您可以在Firefox中使用-moz，在Chrome和Safari中使用-webkit，在IE9和Opera 10.5中使用不以连字符开头的CSS 3 <!DOCTYPE html PUBLIC "-/

我不确定是否可以在HTML中使用，但我仍然会在这里问：

是否有代表椭圆或圆角矩形的HTML代码？

是的，画布。但它实际上是canvasHTML标记，加上Javascript。在这里阅读更多关于画布的信息。

没有。如果您使用HTML和CSS，您可以做到这一点。如果您不介意使用特定于浏览器的CSS，您可以在Firefox中使用-moz，在Chrome和Safari中使用-webkit，在IE9和Opera 10.5中使用不以连字符开头的CSS 3

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>
            Rounded
        </title>
        <style type="text/css">
            div {
                -moz-border-radius-topleft: 6px;
                -webkit-border-top-left-radius: 6px;
                border-top-left-radius: 6px;
                -moz-border-radius-bottomleft: 6px;
                -webkit-border-bottom-left-radius: 6px;
                border-bottom-left-radius: 6px;
                -moz-border-radius-topright: 6px;
                -webkit-border-top-right-radius: 6px;
                border-top-right-radius: 6px;
                -moz-border-radius-bottomright: 6px;
                -webkit-border-bottom-right-radius: 6px;
                border-bottom-right-radius: 6px;
                border:solid 1px black;
                padding:10px;
                background-color:#efefef;
            }
        </style>
    </head>
    <body>
        <div>I'm rounded!</div>
    </body>
</html>


圆的
div{
-左上角moz边界半径：6px；
-webkit边框左上半径：6px；
边框左上半径：6px；
-moz边界半径左下角：6px；
-webkit边框左下半径：6px；
边框左下半径：6px；
-moz边界半径右上角：6px；
-webkit边框右上角半径：6px；
边框右上角半径：6px；
-moz边界半径右下角：6px；
-webkit边框右下半径：6px；
边框右下半径：6px；
边框：实心1px黑色；
填充：10px；
背景色：#EFEF；
}
我是圆的！
CSS3中的边界半径将允许您在大多数浏览器中执行此操作（除了IE../spit）

HTML5提供了一个画布标记，它允许使用Javascript绘制类似的内容。同样，浏览器支持仍在继续

但是，在纯HTML中，您可能永远无法完成所要求的操作。

您可以通过使用找到的技巧（允许您使用div渲染任意大小/位置的直角三角形）来接近其中任何一个

很多很多有着相对较小边界的div。硬编码所有高度和宽度需要很长时间，但是您可以编写一个脚本来生成html代码

当然，最简单、最快捷的解决方案（从开发时间、下载页面所需的时间，甚至可能是呈现时间来看）是使用纯html以外的其他东西，正如这里的其他人已经建议的那样。

另一方面，这是很有可能的！好了：

纯HTML！它甚至不使用任何新的CSS或JavaScript或其他什么脚本。

很遗憾花了这么长时间才得到画布！这并不是一项令人扫兴的运动，但我们不要忘记，如果没有额外的用于画布仿真的JavaScript负载，这将无法在IE上工作。截至2010/04/10，只有Opera 10.5可以使用CSS3实现这一点（我认为IE9预览版也是如此）。对于Chrome 5.0.371.0、Safari 4.0.5和FF 3.6.3，您需要使用供应商扩展。您的另一篇文章与此相矛盾！：请注意，IE9甚至还没有发布日期…我猜要到2011年的某个时候。。。