Is there any HTML code that would display an ellipse or a rounded rectangle?

问题

I am not sure if it's possible at all in HTML, but I would still ask it here:

Is there any HTML code that would stand for an ellipse or a rounded rectangle?

回答1:

On another thought, it's quite possible! There you go:

http://virkkunen.net/b/oh-dear.html

Pure HTML! It doesn't even use any new-fangled CSS or JavaScript or whateverscript.

回答2:

Yes, Canvas. But it's really the Canvas HTML tag, coupled with Javascript. Read more about CANVAS here http://en.wikipedia.org/wiki/Canvas_element

回答3:

If you use HTML and CSS you can do this. If you don't mind using browser-specific CSS, you can get it working in Firefox with -moz, Chrome and Safari with -webkit, and IE9 and Opera 10.5 with the CSS 3 stuff that does not start with a hyphen.

<!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>

回答4:

You could get close to either of those by using the trick found here (allows you to render arbitrarily sized/positioned right triangles using divs)

Lots and lots of divs with relatively small borders. It would take a long time to hard code all the heights and widths, but you could write a script to generate the html code for you.

Of course, the easiest and quickest (in terms of development time, time needed to download the page, and likely even rendering time) solution would be to use something other than pure html, as the other folks here have already suggested.