From 2e4dc6275212e6c6c043dfde41d59dc65340f3b4 Mon Sep 17 00:00:00 2001 From: WATAHIKI YUTO Date: Fri, 12 Sep 2025 23:45:36 +0900 Subject: [PATCH 1/2] =?UTF-8?q?=E3=80=8CHTML=E3=80=8D=E3=81=AE=E7=AF=80?= =?UTF-8?q?=E3=82=92=E6=94=B9=E8=A8=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/1-trial-session/02-html/index.mdx | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) diff --git a/docs/1-trial-session/02-html/index.mdx b/docs/1-trial-session/02-html/index.mdx index f7fa54d7c..e9fc591a9 100644 --- a/docs/1-trial-session/02-html/index.mdx +++ b/docs/1-trial-session/02-html/index.mdx @@ -7,23 +7,27 @@ import openInBrowserVideo from "./open-in-browser.mp4"; import showFileExtensionsVideo from "./show-file-extensions.mp4"; import reloadBrowserVideo from "./reload-browser.mp4"; -Web開発に必ず用いられる言語があります。**HTML**とCSS、そしてJavaScriptです。これらは互いに異なる役割をもっています。まずは最も基本となるHTMLから学んでいきましょう。 +世の中には、数多くのウェブサイトが存在しています。これらはどのようにして作られているのでしょうか。実は、**HTML**とCSS、そしてJavaScriptの3つの言語を用いることで作ることができます。これらは互いに異なる役割をもっています。 -![Web開発で用いられる言語](./web-development-languages.drawio.svg) +![](./web-development-languages.drawio.svg) -## HTMLを書き始める +HTMLは、ウェブサイトの構造を表すことができます。CSSは、色や配置などウェブサイトの見た目を変えることができます。JavaScriptは、ウェブサイトに動きを与えることができます。 -VS Codeの画面左端には、ファイル一覧が表示されています。新しいファイルを作成して、`index.html`と名付けましょう。ファイルの中身を次のようにした後、保存します。保存にはショートカットキー (Ctrl + S (Windows) / command + S (macOS) ) を用いてください。 +まずは最も基本となるHTMLから学んでいきましょう。 + +## はじめてのHTML + +VS Codeの画面左端には、ファイル一覧が表示されています。新しいファイルを作成して、`index.html`と名付けましょう。ファイルの中身を次のようにした後、保存します。保存にはショートカットキー（Ctrl+S（macOSではCommand+S））を用いてください。 ```html title="index.html" - Title + タイトル - Hello World! + Hello HTML! ``` From 6f55f3604a721eda37835fd078588a465bc056ef Mon Sep 17 00:00:00 2001 From: WATAHIKI Yuto Date: Sat, 9 May 2026 18:09:23 +0900 Subject: [PATCH 2/2] WIP --- docs/1-trial-session/02-html/index.mdx | 26 +++++------ src/components/Term/definitions.ts | 62 ++++++++++++++++---------- 2 files changed, 50 insertions(+), 38 deletions(-) diff --git a/docs/1-trial-session/02-html/index.mdx b/docs/1-trial-session/02-html/index.mdx index e9fc591a9..49e9d933e 100644 --- a/docs/1-trial-session/02-html/index.mdx +++ b/docs/1-trial-session/02-html/index.mdx @@ -7,52 +7,50 @@ import openInBrowserVideo from "./open-in-browser.mp4"; import showFileExtensionsVideo from "./show-file-extensions.mp4"; import reloadBrowserVideo from "./reload-browser.mp4"; -世の中には、数多くのウェブサイトが存在しています。これらはどのようにして作られているのでしょうか。実は、**HTML**とCSS、そしてJavaScriptの3つの言語を用いることで作ることができます。これらは互いに異なる役割をもっています。 +私たちは日々、[[ウェブブラウザ]]を通してさまざまなページやアプリを利用しています。これらはどのようにして作られているのでしょうか？実は、[[**HTML**]]と[[CSS]]、そして[[JavaScript]]の3つの言語を用いることで作ることができます。これらは互いに異なる役割をもっています。 -![](./web-development-languages.drawio.svg) +[[HTML]]は、ウェブサイトの構造を表すことができます。[[CSS]]は、色や配置などウェブサイトの見た目を変えることができます。[[JavaScript]]は、ウェブサイトに動きを与えることができます。 -HTMLは、ウェブサイトの構造を表すことができます。CSSは、色や配置などウェブサイトの見た目を変えることができます。JavaScriptは、ウェブサイトに動きを与えることができます。 +![](./web-development-languages.drawio.svg) -まずは最も基本となるHTMLから学んでいきましょう。 +まずは最も基本となる[[HTML]]から学んでいきましょう。 ## はじめてのHTML -VS Codeの画面左端には、ファイル一覧が表示されています。新しいファイルを作成して、`index.html`と名付けましょう。ファイルの中身を次のようにした後、保存します。保存にはショートカットキー（Ctrl+S（macOSではCommand+S））を用いてください。 +まず、[[HTML]]を書くための[[ファイル]]を作成します。VS Codeの画面左端から、新しい[[ファイル]]を作成して、`index.html`と名付けましょう。次に、[[ファイル]]の中身を次のようにして、保存します。保存には[[ショートカットキー]]（Control+S（macOSではCommand+S））を用いてください。 ```html title="index.html" - タイトル + 天気予報の確認 - Hello HTML! + 出かける前に、気象庁の天気予報を確認しましょう。 ```