5

HTMLでそれが可能かどうかはわかりませんが、それでもここで質問します。

楕円または角丸長方形を表すHTMLコードはありますか?

4

6 に答える 6

9

別の考えでは、それはかなり可能です!そこに行きます:

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

純粋なHTML!新しいCSSやJavaScriptなどのスクリプトも使用していません。

于 2010-04-10T23:59:58.917 に答える
4

はい、Canvasです。しかし、これは実際には、Javascriptと組み合わせたCanvasHTMLタグです。CANVASの詳細については、http://en.wikipedia.org/wiki/Canvas_elementをご覧ください。

于 2010-04-10T23:31:04.020 に答える
4

HTMLとCSSを使用する場合は、これを行うことができます。ブラウザ固有のCSSを使用してもかまわない場合は、Firefoxで-mozを使用し、ChromeとSafariで-webkitを使用し、IE9とOpera10.5でCSS3を使用してハイフンで始まらないようにすることができます。

<!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>
于 2010-04-10T23:33:15.433 に答える
2

ここにあるトリックを使用して、これらのいずれかに近づくことができます(divを使用して任意のサイズ/位置の直角三角形をレンダリングできます)

境界線が比較的小さいたくさんのdiv。すべての高さと幅をハードコーディングするには長い時間がかかりますが、HTMLコードを生成するスクリプトを作成することもできます。

もちろん、(開発時間、ページのダウンロードに必要な時間、そしておそらくレンダリング時間の点で)最も簡単で迅速な解決策は、他の人々がすでに示唆しているように、純粋なhtml以外のものを使用することです。

于 2010-04-10T23:45:53.547 に答える
1

CSS3の境界線の半径により、ほとんどのブラウザーでこれを実行できます(IE ... / spitを除く)。http://www.css3.info/preview/rounded-border/

HTML5はcanvasタグを提供します。これにより、Javascriptを使用して同様のものを描画できます。繰り返しになりますが、ブラウザのサポートはまだ進行中です。

ただし、純粋なHTMLで要求していることを実行できない可能性があります。

于 2010-04-10T23:33:47.670 に答える
-1

いいえ、ありません。

于 2010-04-10T23:31:13.550 に答える