From 218934fa2ed1c702a6d3923d2aa2cc6b43c48684 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:43:23 -0500 Subject: initial commit --- files/zh-tw/sandbox/index.html | 180 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 180 insertions(+) create mode 100644 files/zh-tw/sandbox/index.html (limited to 'files/zh-tw/sandbox/index.html') diff --git a/files/zh-tw/sandbox/index.html b/files/zh-tw/sandbox/index.html new file mode 100644 index 0000000000..ce4d515992 --- /dev/null +++ b/files/zh-tw/sandbox/index.html @@ -0,0 +1,180 @@ +--- +title: Sandbox 沙盒 +slug: Sandbox +translation_of: Sandbox +--- +

This is a page 這是一張紙

+ + + +

Test

+ +

如何插入程式碼區塊，並即時預覽：Toolbar 第三行，點擊「插入程式碼範例模板」按鈕

+ +

HTML

+ +
<p>hello sandbox</p>
+ +

CSS

+ +
p {
+  color: blue;
+}
+ +

JavaScript

+ +
var p = document.querySelector('p');
+p.addEventListener('mouseover', function(e) {
+  p.style.color = 'green';
+})
+p.addEventListener('mouseout', function(e) {
+  p.style.color = 'blue';
+})
+
+
+ +

結果

+ +

{{EmbedLiveSample('Test')}}

+ + + +

其他

+ +

CSS Content

+ +
@ Compteur de style fisheye {
+  système: cyclique;
+  symboles: ◉;
+
+ +
<h1>CSS font-family</h1>
+<p class="serif">This is a paragraph, shown in the Times New Roman font.</p>
+<p class="sansserif">This is a paragraph, shown in the Arial font.</p>
+ +

+}
+
+.liste {
+    list-style: fisheye, cercle;
+}
+ +

Hello World

+ +

HTML

+ +
<p>Hello World</p>
+ +

{{EmbedLiveSample ( 'Linux is life')}}

+ +

Linux logo

+ +

logo couleur MDN (bleu)

+ +

Des trucs

+ +
+

Une note 

+ +
+

Un avertissement dans une note

+ +
+

Une note dans un avertissement dans une note

+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+

une autre note

+ +
+

Une note dans une note

+
+ +

This is an example of how to use the MDN!

+
+ +

π×1=1×π=2π÷π=π\ Pi \ times 1 = 1 \ times \ pi = 2 \ pi \ div \ pi = \ pi

+ +

ππππππ\ Pi \ frac {\ pi} {\ pi} \ frac {\ frac {\ pi} {\ pi}} {\ pi}

+ +

ππππππ\ Pi \ frac {\ pi} {\ pi} \ frac {\ frac {\ pi} {\ pi}} {\ pi}

+ +

∫limjets13e3/XX2réX\ Int \ limits_ {1} ^ {3} \ frac {e ^ 3 / x} {x ^ 2} \, dx

+ +

∫ln(x) dx = x[ln(x) - 1]l\ Int \ limits_ {1} ^ {3} \ frac {e ^ 3 / x} {x ^ 2} \, d+x

+ +

abcdefghijklmnopqrstuvwxyz\alphabet

+ +

πest un nombre irrationnel, et cela est le rapport entre la circonférence d'un cercle à son diamètre. Il est communément approchée comme 3,14159.\ pifacts {3}

+ +

contenu

+ +

Test live sample

+ +

HTML Content

+ +
<p>Hello World</p>
+ +

Result

+ +

{{ EmbedLiveSample('Test live sample') }}

+ +

+ +

Focus on a text field

+ +

HTML Content

+ +
<input type="text" id="myTextField" value="Text field.">
+<p></p>
+<button type="button" onclick="focusMethod()">Click me to focus on the text field!</button>
+ +

CSS Content

+ +
/* Sample CSS Content */
+ +

JavaScript Content

+ +
focusMethod = function getFocus() {
+  document.getElementById("myTextField").focus();
+}
+ +

Result

+ +

{{ EmbedLiveSample('Focus_on_a_text_field') }}

+ +

Focus on a button

+ +

HTML Content

+ +
<button type="button" id="myButton">Click Me!</button>
+<p></p>
+<button type="button" onclick="focusMethod()">Click me to focus on the button!</button>
+ +

CSS Content

+ +
Sample CSS Content
+ +

JavaScript Content

+ +
focusMethod = function getFocus() {
+  document.getElementById("myButton").focus();
+}
+ +

Result

+ +

{{ EmbedLiveSample('Focus_on_a_button') }}

-- cgit v1.2.3-54-g00ecf