Javascript
 Computer >> コンピューター >  >> プログラミング >> Javascript

HTML5でのタグの操作


次のコードを実行して、HTML5でタグを操作する方法を学ぶことができます。

<html>
   <head>
      <style>
         #svgelem{
            position: relative;
            left: 50%;
            -webkit-transform: translateX(-40%);
            -ms-transform: translateX(-40%);
            transform: translateX(-40%);
         }
      </style>

      <title>SVG</title>
      <meta charset="utf-8" />
   </head>
   <body>
      <h2 align="center">HTML5 SVG Star</h2>
      <svg id="svgelem" height="200" xmlns="https://www.w3.org/2000/svg">
      <polygon points="100,10 40,180 190,60 10,60 160,180" fill="red"/>
      </svg>
   </body>
</html>

  1. HTML5 SVGで星を描く方法は?

    SVGはScalableVectorGraphicsの略で、2DグラフィックスとグラフィカルアプリケーションをXMLで記述するための言語であり、XMLはSVGビューアによってレンダリングされます。ほとんどのWebブラウザーは、PNG、GIF、およびJPGを表示できるのと同じようにSVGを表示できます。 HTML SVGでポリゴンを描画するには、SVG要素を使用します。 要素は、少なくとも3つの辺を含むグラフィックを作成します。 HTML5 SVGで星を描くには、各コーナーのx座標とy座標を適切に設定する必要があります。 例 次のコードを実行して、HTML5SVGで星を描く方法を学ぶこ

  2. HTML5SVGで星の形を作る

    これは、タグを使用して星を描くSVGの例のHTML5バージョンです。 <html>    <head>       <style>          #svgelem{             position: relative;             left: 50%;         &nb