資料結構
網路
RDBMS
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理
化學
生物
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究如何在 HTML5 中使用 SVG 繪製形狀？
SVG 是可縮放向量圖形的縮寫，是一種用 XML 描述 2D 圖形和圖形應用程式的語言，然後由 SVG 瀏覽器渲染 XML。大多數網路瀏覽器都可以顯示 SVG，就像它們可以顯示 PNG、GIF 和 JPG 一樣。
使用 HTML5 中的 SVG，你可以輕鬆地繪製圓形、矩形、線等形狀。讓我們看一個使用 SVG 繪製矩形的示例。
示例
你可以嘗試執行以下程式碼，在 HTML5 中繪製一個矩形。將使用 <rect> 元素
<!DOCTYPE html>
<html>
<head>
<style>
#svgelem {
position: relative;
left: 10%;
-webkit-transform: translateX(-20%);
-ms-transform: translateX(-20%);
transform: translateX(-20%);
}
</style>
<title>SVG</title>
</head>
<body>
<h2>HTML5 SVG Rectangle</h2>
<svg id="svgelem" width="300" height="200" xmlns="http://www.w3.org/2000/svg">
<rect width="200" height="100" fill="green"/>
</svg>
</body>
</html>輸出
更新時間： 2021-12-16
1K+ 瀏覽量
廣告