From fcaf278de3a2d71b1a94cabdaa934b895b3916bf Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Mon, 28 Feb 2022 23:16:41 +0900 Subject: Element 以下のプロパティの記事を移行 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/api/element/localname/index.md | 87 +++++++++++++++++++++++++++++ 1 file changed, 87 insertions(+) create mode 100644 files/ja/web/api/element/localname/index.md (limited to 'files/ja/web/api/element/localname/index.md') diff --git a/files/ja/web/api/element/localname/index.md b/files/ja/web/api/element/localname/index.md new file mode 100644 index 0000000000..b92152fbfa --- /dev/null +++ b/files/ja/web/api/element/localname/index.md @@ -0,0 +1,87 @@ +--- +title: Element.localName +slug: Web/API/Element/localName +tags: +- API +- DOM +- NeedsBrowserCompatibility +- NeedsMobileBrowserCompatibility +- Property +- Reference +browser-compat: api.Element.localName +translation_of: Web/API/Element/localName +--- +
{{APIRef("DOM")}}
+ +

Element.localName は読み取り専用プロパティで、要素の修飾名のローカル部分を返します。

+ +

構文

+ +
name = element.localName
+
+ +

返値

+ +

要素の修飾名の、ローカル部分を示す {{domxref("DOMString")}} です。 +

+ +

例

+ +

(text/xml や application/xhtml+xml のような、XML のコンテンツタイプで送出される必要があります。)

+ +
<html xmlns="http://www.w3.org/1999/xhtml"
+      xmlns:svg="http://www.w3.org/2000/svg">
+<head>
+  <script type="application/javascript"><![CDATA[
+  function test() {
+    var text = document.getElementById('text');
+    var circle = document.getElementById('circle');
+
+    text.value = "<svg:circle> has:\n" +
+                 "localName = '" + circle.localName + "'\n" +
+                 "namespaceURI = '" + circle.namespaceURI + "'";
+  }
+  ]]></script>
+</head>
+<body onload="test()">
+  <svg:svg version="1.1"
+    width="100px" height="100px"
+    viewBox="0 0 100 100">
+    <svg:circle cx="50" cy="50" r="30" style="fill:#aaa" id="circle"/>
+  </svg:svg>
+  <textarea id="text" rows="4" cols="55"/>
+</body>
+</html>
+
+ +

注

+ +

ノードのローカル名とは、ノードの修飾名の、コロンの後に続く部分です。 XML において修飾名は、一般に特定の XML 文書の名前空間の一部として使われます。例えば、ecomm:partners という修飾名において、 partners はローカル名、ecomm は接頭辞です。

+ +
<ecomm:business id="soda_shop" type="brick_n_mortar" xmlns:ecomm="http://example.com/ecomm">
+  <ecomm:partners>
+    <ecomm:partner id="1001">Tony's Syrup Warehouse
+    </ecomm:partner>
+  </ecomm:partner>
+</ecomm:business>
+
+ +
+

注: {{Gecko("1.9.2")}} 以前、このプロパティは、HTML DOM における HTML 要素ではローカル名を大文字で返していました（XML DOM における XHTML 要素とは対照的に）。最新バージョンでは HTML5 に従い、このプロパティは内部の DOM ストレージの場合、 HTML DOM における HTML要素と XHTML DOM における XHTML要素のいずれも、小文字で返します。{{domxref("element.tagName","tagName")}} プロパティは引き続き、 HTML DOM における HTML 要素では大文字で返します。

+
+ +

仕様書

+ +{{Specifications}} + +

ブラウザーの互換性

+ +

{{Compat}}

+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf From 10ba082441b43b1b232a2439ee2d181316bae8fa Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Mon, 28 Feb 2022 23:27:56 +0900 Subject: 2021/09/15 時点の英語版に同期 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/api/element/attributes/index.md | 136 ++++++++------------- .../ja/web/api/element/childelementcount/index.md | 39 +++--- files/ja/web/api/element/children/index.md | 47 ++++--- files/ja/web/api/element/classname/index.md | 82 ++++++++----- files/ja/web/api/element/clientheight/index.md | 66 ++++------ files/ja/web/api/element/clientwidth/index.md | 64 ++++------ files/ja/web/api/element/localname/index.md | 96 +++++++-------- files/ja/web/api/element/prefix/index.md | 44 +++---- files/ja/web/api/element/tagname/index.md | 85 ++++++++----- 9 files changed, 324 insertions(+), 335 deletions(-) (limited to 'files/ja/web/api/element/localname/index.md') diff --git a/files/ja/web/api/element/attributes/index.md b/files/ja/web/api/element/attributes/index.md index f3653263ef..05f85d4bf7 100644 --- a/files/ja/web/api/element/attributes/index.md +++ b/files/ja/web/api/element/attributes/index.md @@ -6,113 +6,85 @@ tags: - Attributes - DOM - Element - - Property - プロパティ - リファレンス - - 属性 +browser-compat: api.Element.attributes translation_of: Web/API/Element/attributes --- -

{{ APIRef("DOM") }}

+{{ APIRef("DOM") }} -

Element.attributes プロパティは、そのノードに登録された全ての属性ノードのコレクションを返却します。返却される値は {{domxref("NamedNodeMap")}} であり、 Array ではありません。つまり、 {{jsxref("Array")}} のメソッドは持っておらず、 {{domxref("Attr")}} ノードのインデックスはブラウザーによって変わる可能性があります。より正確に言うと、 attributes はその属性に関するあらゆる情報を表す文字列のキーと値の組です。

+**`Element.attributes`** プロパティは、そのノードに登録されたすべての属性ノードの生きたコレクションを返却します。返却される値は {{domxref("NamedNodeMap")}} であり、 `Array` ではありません。つまり、 {{jsxref("Array")}} のメソッドは持っておらず、 {{domxref("Attr")}} ノードのインデックスはブラウザーによって変わる可能性があります。より正確に言うと、 `attributes` はその属性に関するあらゆる情報を表す文字列のキーと値の組です。 -

構文

+## 構文 -
var attr = element.attributes;
-
+```js +var attr = element.attributes; +``` -

例

+## 例 -

基本的な例

+### 基本的な例 -
// ドキュメント内の最初の <p> 要素を取得する
+```js
+// 文書内の最初の 
 要素を取得
 var para = document.getElementsByTagName("p")[0];
-var atts = para.attributes;
+var atts = para.attributes; +``` -

要素の属性を列挙する

+### 要素の属性を列挙する -

ある要素の全ての属性を走査したい時には、インデックスを使うと便利です。
- 次の例では、 "paragraph" を id に持つ要素の全ての属性ノードを走査し、その属性の値を表示します。

+ある要素のすべての属性を走査したい場合は、数値のインデックスを使うと便利です。 +次の例では、 "paragraph" を id に持つ要素のすべての属性ノードを走査し、その属性の値を表示します。 -
<!DOCTYPE html>
+```html
+
 
-<html>
+
 
- <head>
-  <title>Attributes example</title>
-  <script type="text/javascript">
+ 
+  Attributes example
+  
+ 
+
+
+ 
サンプルの段落

+ 

+  

+    
+    
+  

+ 

+
+
+```
+
+## 仕様書
+
+{{Specifications}}
+
+## ブラウザーの互換性
+
+{{Compat}}
+
+## 関連情報
+
+- 返却される値のインターフェースである {{domxref("NamedNodeMap")}}
+- [quirksmode](https://www.quirksmode.org/dom/w3c_core.html#attributes) におけるブラウザー間の互換性の考慮事項
diff --git a/files/ja/web/api/element/childelementcount/index.md b/files/ja/web/api/element/childelementcount/index.md
index c3520c9a31..1e869a7dc2 100644
--- a/files/ja/web/api/element/childelementcount/index.md
+++ b/files/ja/web/api/element/childelementcount/index.md
@@ -4,39 +4,40 @@ slug: Web/API/Element/childElementCount
 tags:
   - API
   - DOM
-  - Property
-  - Reference
+  - プロパティ
+  - リファレンス
 browser-compat: api.Element.childElementCount
 translation_of: Web/API/Element/childElementCount
 original_slug: Web/API/ParentNode/childElementCount
 ---
-
{{ APIRef("DOM") }}

+{{ APIRef("DOM") }}
 
-
Element.childElementCount は読み取り専用のプロパティで、この要素の子要素の数を返します。

+**`Element.childElementCount`** は読み取り専用のプロパティで、この要素の子要素の数を返します。
 
-
構文

+## 構文
 
-
element.childElementCount;

+```js
+element.childElementCount;
+```
 
-
例

+## 例
 
-
let sidebar = document.getElementById('sidebar');
-if (sidebar.childElementCount > 0) {
-  // 何もしない
+```js
+let sidebar = document.getElementById('sidebar');
+if (sidebar.childElementCount > 0) {
+  // 何かを行う
 }
-

+```
 
-
仕様書

+## 仕様書
 
 {{Specifications}}
 
-
ブラウザーの互換性

+## ブラウザーの互換性
 
-
{{Compat}}

+{{Compat}}
 
-
関連情報

+## 関連情報
 
-
    
-  
  • {{domxref("Document.childElementCount")}}
    • 
-  
  • {{domxref("DocumentFragment.childElementCount")}}
    • 
-

+- {{domxref("Document.childElementCount")}}
+- {{domxref("DocumentFragment.childElementCount")}}
diff --git a/files/ja/web/api/element/children/index.md b/files/ja/web/api/element/children/index.md
index 5dd887af4f..01e0dc6627 100644
--- a/files/ja/web/api/element/children/index.md
+++ b/files/ja/web/api/element/children/index.md
@@ -6,53 +6,50 @@ tags:
   - DOM
   - Element
   - HTMLCollection
-  - Property
+  - プロパティ
   - children
 browser-compat: api.Element.children
 translation_of: Web/API/Element/children
 original_slug: Web/API/ParentNode/children
 ---
-
{{ APIRef("DOM") }}

+{{ APIRef("DOM") }}
 
-
children は読み取り専用のプロパティで、生きた {{domxref("HTMLCollection")}} で呼び出された要素の子{{domxref("Element", "要素", "", 1)}}をすべて返します。

+**`children`** は読み取り専用のプロパティで、生きた {{domxref("HTMLCollection")}} で呼び出された要素の子{{domxref("Element", "要素", "", 1)}}をすべて返します。
 
-
Element.children は要素のノードしか含みません。すべての子ノード、例えばテキストやコメントノードなどを取得するには、 {{domxref("Node.childNodes")}} を使用してください。

+`Element.children` は要素のノードしか含みません。すべての子ノード、例えばテキストやコメントノードなどを取得するには、 {{domxref("Node.childNodes")}} を使用してください。
 
-
構文

+## 構文
 
-
-// Getter
+```js
+// ゲッター
 collection = myElement.children;
 
-// No setter; read-only property
-

+// セッターはありません。読み取り専用プロパティです。
+```
 
-
返値

+### 返値
 
-
生きた {{ domxref("HTMLCollection") }} で、 node の子の DOM 要素の順序付きコレクションを返します。コレクションの {{domxref("HTMLCollection.item()", "item()")}} メソッドか、 JavaScript の配列スタイルの記法を使って、コレクション内の個々の子ノードにアクセスすることができます。

+生きた {{ domxref("HTMLCollection") }} で、 `node` の子の DOM 要素の順序付きコレクションを返します。コレクションの {{domxref("HTMLCollection.item()", "item()")}} メソッドか、 JavaScript の配列スタイルの記法を使って、コレクション内の個々の子ノードにアクセスすることができます。
 
-
ノードが子要素を持たない場合、 children は要素を含まず、length は 0 です。

+ノードが子要素を持たない場合、 `children` は要素を含まず、`length` は `0` です。
 
-
例 

+## 例
 
-
const myElement = document.getElementById('foo');
-for (let i = 0; i < myElement.children.length; i++) {
+```js
+const myElement = document.getElementById('foo');
+for (let i = 0; i < myElement.children.length; i++) {
   console.log(myElement.children[i].tagName);
 }
-

+```
 
-
仕様書

+## 仕様書
 
 {{Specifications}}
 
-
ブラウザーの互換性

+## ブラウザーの互換性
 
-
{{Compat}}

+{{Compat}}
 
-
関連情報

+## 関連情報
 
-
    
-  
  • 
-    {{domxref("Node.childNodes")}}
-  
    • 
-

+- {{domxref("Node.childNodes")}}
diff --git a/files/ja/web/api/element/classname/index.md b/files/ja/web/api/element/classname/index.md
index 00f15100e7..bbdbcc000b 100644
--- a/files/ja/web/api/element/classname/index.md
+++ b/files/ja/web/api/element/classname/index.md
@@ -1,35 +1,61 @@
 ---
-title: element.className
+title: Element.className
 slug: Web/API/Element/className
 tags:
+  - API
   - DOM
   - Gecko
-  - Gecko DOM Reference
+  - プロパティ
+  - リファレンス
+browser-compat: api.Element.className
 translation_of: Web/API/Element/className
 ---
-

- {{ApiRef}}

-
概要

-
className は要素の class 属性の値の取得 / 設定に用います。

-
構文

-
cName = elementNodeReference.className;
-elementNodeReference.className = cName;

-
    
- 
  • cName : クラス名（文字列）
    • 
-

-
例

-
var elm = document.getElementById("div1"); //対象要素を取得
-
-if (elm.className == "fixed") {
-  // 対象要素のクラス名が "fixed" であった場合の処理をここに記述
-}

-
注記

-
"class" という語句はプログラミングに於いて様々な文脈で用いられる為、競合を防ぐために className という名称となっています。

-
仕様書

-
-
関連情報

-
    
- 
  • {{domxref("element.classList")}}
    • 
-

+{{APIRef("DOM")}}
+
+**`className`** は {{domxref("Element")}} インターフェイスのプロパティで、この要素の [`class` 属性](/ja/docs/Web/HTML/Global_attributes/class)の値を取得したり設定したりします。
+
+## 構文
+
+```js
+var cName = elementNodeReference.className;
+elementNodeReference.className = cName;
+```
+
+- `cName` は文字列変数で、現在の要素のクラスまたは空白区切りのクラス群を表します。
+
+## 例
+
+```js
+let el = document.getElementById('item');
+
+if (el.className === 'active'){
+  el.className = 'inactive';
+} else {
+  el.className = 'active';
+}
+```
+
+## メモ
+
+このプロパティでは、 `className` という名前が `class` の代わりに使用されています。
+これは DOM を操作するために使用される多くの言語と "class" キーワードが競合するためです。
+
+`className` は {{domxref("SVGAnimatedString")}} のインスタンスにも、 `element` が {{domxref("SVGElement")}} であれば存在する可能性があります。 SVG 要素を扱っている場合は、要素の `className` は {{domxref("Element.getAttribute")}} や {{domxref("Element.setAttribute")}} を使用して取得したり設定したりした方がいいでしょう。しかし、その要素の [`class` 属性](/ja/docs/Web/HTML/Global_attributes/class)が空であった場合、 {{domxref("Element.getAttribute")}} は`""` ではなく [`null`](/ja/docs/Web/JavaScript/Reference/Global_Objects/null) を返すことに注意してください。
+
+```js
+elm.setAttribute('class', elm.getAttribute('class'))
+```
+
+> **Note:** `class` は **HTML 属性**であり、 `className` は **DOM プロパティ**です。
+
+## 仕様書
+
+{{Specifications}}
+
+## ブラウザーの互換性
+
+{{Compat}}
+
+## 関連情報
+
+- {{domxref("element.classList")}}
diff --git a/files/ja/web/api/element/clientheight/index.md b/files/ja/web/api/element/clientheight/index.md
index 4cde36518d..15d1cc596a 100644
--- a/files/ja/web/api/element/clientheight/index.md
+++ b/files/ja/web/api/element/clientheight/index.md
@@ -5,63 +5,47 @@ tags:
   - API
   - CSSOM View
   - NeedsMarkupWork
-  - Property
-  - Reference
+  - プロパティ
+  - リファレンス
+browser-compat: api.Element.clientHeight
 translation_of: Web/API/Element/clientHeight
 ---
-
{{APIRef("DOM")}}

+{{APIRef("DOM")}}
 
-
Element.clientHeight は読み取り専用のプロパティで、 CSS のない要素やインラインレイアウトボックスではゼロになります。それ以外では、要素の内側の寸法をピクセル単位で表します。パディングは含みますが、境界、マージン、 (もしあれば) 水平スクロールバーは含みません。

+**`Element.clientHeight`** は読み取り専用のプロパティで、 CSS のない要素やインラインレイアウトボックスではゼロになります。それ以外では、要素の内側の寸法をピクセル単位で表します。パディングは含みますが、境界、マージン、（もしあれば）水平スクロールバーは含みません。
 
-
clientHeight は CSS height + CSS padding - 水平スクロールバーの高さ(height) (もしあれば) として計算できます。

+`clientHeight` は CSS `height` + CSS `padding` - 水平スクロールバーの高さ (もしあれば) として計算できます。
 
-
clientHeight がルート要素 (<html> 要素) (または文書が後方互換モードである場合は <body>) に使用された場合、 (スクロールバーを除いた) ビューポートの高さが返されます。これは clientHeight の特例です。

+`clientHeight` がルート要素（`` 要素）（または文書が後方互換モードである場合は ``）に使用された場合、（スクロールバーを除いた）ビューポートの高さが返されます。[これは `clientHeight` の特例です](https://www.w3.org/TR/2016/WD-cssom-view-1-20160317/#dom-element-clientheight)。
 
-

-
注: このプロパティは値を整数値に丸めます。小数値が必要であれば、 {{ domxref("element.getBoundingClientRect()") }} を使用してください。

-

+> **Note:** このプロパティは値を整数値に丸めます。小数値が必要であれば、 {{ domxref("element.getBoundingClientRect()") }} を使用してください。
 
-
構文

+## 構文
 
-
var intElemClientHeight = element.clientHeight;

+```js
+var intElemClientHeight = element.clientHeight;
+```
 
-
intElemClientHeight は element の clientHeight をピクセル単位で表す整数値です。 clientHeight プロパティは読み取り専用です。

+`intElemClientHeight` は `element` の `clientHeight` をピクセル単位で表す整数値です。 `clientHeight` プロパティは読み取り専用です。
 
-
例

+## 例
 
-
Image:Dimensions-client.png

+![](dimensions-client.png)
 
-
仕様書

+## 仕様書
 
-
- 
-  
-   
-   
-   
-  
- 
- 
-  
-   
-   
-   
-  
- 
-
仕様書状態備考
{{SpecName('CSSOM View', '#dom-element-clientheight', 'clientHeight')}}{{Spec2("CSSOM View")}}

+{{Specifications}}
 
-
注

+### メモ
 
-
clientHeight は Internet Explorer オブジェクトモデルで導入されたプロパティです。

+`clientHeight` は Internet Explorer オブジェクトモデルで導入されたプロパティです。
 
-
ブラウザーの互換性

+## ブラウザーの互換性
 
-
{{Compat("api.Element.clientHeight")}}

+{{Compat}}
 
-
関連情報

+## 関連情報
 
-
+- {{domxref("HTMLElement.offsetHeight")}}
+- {{domxref("Element.scrollHeight")}}
+- [要素の寸法の決定](/ja/docs/Web/API/CSS_Object_Model/Determining_the_dimensions_of_elements)
diff --git a/files/ja/web/api/element/clientwidth/index.md b/files/ja/web/api/element/clientwidth/index.md
index 47753e0077..af5d5481ca 100644
--- a/files/ja/web/api/element/clientwidth/index.md
+++ b/files/ja/web/api/element/clientwidth/index.md
@@ -4,62 +4,46 @@ slug: Web/API/Element/clientWidth
 tags:
   - API
   - CSSOM View
-  - Property
-  - Reference
+  - NeedsMarkupWork
+  - リファレンス
   - プロパティ
+browser-compat: api.Element.clientWidth
 translation_of: Web/API/Element/clientWidth
 ---
-
{{APIRef("DOM")}}

+{{APIRef("DOM")}}
 
-
Element.clientWidth プロパティは、インライン要素や CSS のない要素ではゼロになります。それ以外では、要素の内側の寸法をピクセル単位で表します。パディングは含みますが、境界、マージン、 (もしあれば) 垂直スクロールバーは含みません。

+**`Element.clientWidth`** プロパティは、インライン要素や CSS のない要素ではゼロになります。それ以外では、要素の内側の寸法をピクセル単位で表します。パディングは含みますが、境界、マージン、（もしあれば）垂直スクロールバーは含みません。
 
-
clientWidth がルート要素 (<html> 要素) (または文書が後方互換モードである場合は <body>) に使用された場合、 (スクロールバーの幅を除く) ビューポートの幅が返されます。これは clientWidth の特例です。

+`clientWidth` がルート要素（`` 要素）（または文書が後方互換モードである場合は ``）に使用された場合、（スクロールバーを除いた）ビューポートの高さが返されます。[これは `clientWidth` の特例です](https://www.w3.org/TR/2016/WD-cssom-view-1-20160317/#dom-element-clientwidth)。
 
-

-
メモ: このプロパティは値を整数値に丸めます。小数値が必要であれば、 {{ domxref("element.getBoundingClientRect()") }} を使用してください。

-

+> **Note:** このプロパティは値を整数に丸めます。小数の値が必要な場合は、 {{ domxref("element.getBoundingClientRect()") }} を使用してください。
 
-
構文

+## 構文
 
-
var intElemClientWidth = element.clientWidth;

+```js
+var intElemClientWidth = element.clientWidth;
+```
 
-
intElemClientWidth は element の clientWidth をピクセル数で表す整数値です。 clientWidth プロパティは読み取り専用です。

+`intElemClientWidth` は `element` の `clientWidth` をピクセル数で表す整数値です。 `clientWidth` プロパティは読み取り専用です。
 
-
例

+## 例
 
-
Image:Dimensions-client.png

+![](dimensions-client.png)
 
-
仕様書

+## 仕様書
 
-
- 
-  
-   
-   
-   
-  
- 
- 
-  
-   
-   
-   
-  
- 
-
仕様書状態備考
{{SpecName('CSSOM View', '#dom-element-clientwidth', 'clientWidth')}}{{Spec2("CSSOM View")}}

+{{Specifications}}
 
-
メモ

+## メモ
 
-
clientWidth は MS IE DHTML オブジェクトモデルにおいて初めて導入されました。

+`clientTop` は MS IE DHTML オブジェクトモデルで最初に導入されました。
 
-
ブラウザーの互換性

+## ブラウザーの互換性
 
-
{{Compat("api.Element.clientWidth")}}

+{{Compat}}
 
-
関連情報

+## 関連情報
 
-
+- {{domxref("HTMLElement.offsetWidth")}}
+- {{domxref("Element.scrollWidth")}}
+- [要素の寸法の決定](/ja/docs/Web/API/CSS_Object_Model/Determining_the_dimensions_of_elements)
diff --git a/files/ja/web/api/element/localname/index.md b/files/ja/web/api/element/localname/index.md
index b92152fbfa..c676607ad5 100644
--- a/files/ja/web/api/element/localname/index.md
+++ b/files/ja/web/api/element/localname/index.md
@@ -6,82 +6,80 @@ tags:
 - DOM
 - NeedsBrowserCompatibility
 - NeedsMobileBrowserCompatibility
-- Property
-- Reference
+- プロパティ
+- リファレンス
 browser-compat: api.Element.localName
 translation_of: Web/API/Element/localName
 ---
-
{{APIRef("DOM")}}

+{{APIRef("DOM")}}
 
-
Element.localName は読み取り専用プロパティで、要素の修飾名のローカル部分を返します。

+**`Element.localName`** は読み取り専用プロパティで、要素の修飾名のローカル部分を返します。
 
-
構文

+## 構文
 
-
name = element.localName
-

+```js
+name = element.localName
+```
 
-
返値

+### 返値
 
-
要素の修飾名の、ローカル部分を示す {{domxref("DOMString")}} です。
-

+要素の修飾名の、ローカル部分を示す {{domxref("DOMString")}} です。
 
-
例

+## 例
 
-
(text/xml や application/xhtml+xml のような、XML のコンテンツタイプで送出される必要があります。)

+(`text/xml` や `application/xhtml+xml` のような、XML のコンテンツタイプで送出される必要があります。)
 
-
<html xmlns="http://www.w3.org/1999/xhtml"
-      xmlns:svg="http://www.w3.org/2000/svg">
-<head>
-  <script type="application/javascript"><![CDATA[
+```xml
+
+
+  
+
+
+  
+    viewBox="0 0 100 100">
+    
+  
+