Enviar pesquisa
Carregar
Html講義
•
Transferir como PPTX, PDF
•
0 gostou
•
448 visualizações
J
Junya Koshiro
Seguir
about HTML at Japanese
Leia menos
Leia mais
Tecnologia
Denunciar
Compartilhar
Denunciar
Compartilhar
1 de 16
Baixar agora
Recomendados
HTML初心者講座
HTML初心者講座
Yusuke Miyazaki
Htmlの書き方入門編
Htmlの書き方入門編
touhou
メディア芸術基礎 Ⅰ 第2回 HTML入門
メディア芸術基礎 Ⅰ 第2回 HTML入門
Atsushi Tadokoro
Web勉強会(HTML+CSS+JS入門の入門)
Web勉強会(HTML+CSS+JS入門の入門)
Noriaki UCHIYAMA
HTML入門
HTML入門
sayoko miura
Lesson Html 01
Lesson Html 01
kamihide
第三回ネットワークチーム講座資料
第三回ネットワークチーム講座資料
densan_teacher
HTTP入門
HTTP入門
Sota Sugiura
Recomendados
HTML初心者講座
HTML初心者講座
Yusuke Miyazaki
Htmlの書き方入門編
Htmlの書き方入門編
touhou
メディア芸術基礎 Ⅰ 第2回 HTML入門
メディア芸術基礎 Ⅰ 第2回 HTML入門
Atsushi Tadokoro
Web勉強会(HTML+CSS+JS入門の入門)
Web勉強会(HTML+CSS+JS入門の入門)
Noriaki UCHIYAMA
HTML入門
HTML入門
sayoko miura
Lesson Html 01
Lesson Html 01
kamihide
第三回ネットワークチーム講座資料
第三回ネットワークチーム講座資料
densan_teacher
HTTP入門
HTTP入門
Sota Sugiura
[BurpSuiteJapan]HTTP基礎入門
[BurpSuiteJapan]HTTP基礎入門
Burp Suite Japan User Group
C#によるファイルの読み書き
C#によるファイルの読み書き
Hiroki Takahashi
Html s1
Html s1
Jun Chiba
Web班番外編
Web班番外編
XMLProJ2014
WEB開発はじめの一歩 講師:村井亮介様
WEB開発はじめの一歩 講師:村井亮介様
株式会社GreenHack
Web講座 第1回
Web講座 第1回
nanametown
Html1
Html1
Jun Chiba
Html入門
Html入門
GIG inc.
HTML
HTML
Jun Chiba
HTML5 for IA
HTML5 for IA
Atsushi HASEGAWA, Ph.D.
Webタグについて
Webタグについて
株式会社ジオロジック
About http
About http
RyosukeIzawa
45分で理解する webクローリング入門 斉藤之雄
45分で理解する webクローリング入門 斉藤之雄
Yukio Saito
Htmlの基本
Htmlの基本
SD Labo
Htmlの基礎
Htmlの基礎
SD Labo
Geek women japanのロゴをhtmlとcssで作る2
Geek women japanのロゴをhtmlとcssで作る2
Lina Katayose
Geek women japanのロゴをhtmlとcssで作る
Geek women japanのロゴをhtmlとcssで作る
Lina Katayose
勉強会資料①
勉強会資料①
真亮 坂口
『RESTful Web サービス』読書会 第4回 9章 説明資料
『RESTful Web サービス』読書会 第4回 9章 説明資料
Siena. N
WebMatrixに対応した、新しいけど新しくないRazor
WebMatrixに対応した、新しいけど新しくないRazor
Sho Okada
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NTT DATA Technology & Innovation
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
sn679259
Mais conteúdo relacionado
Semelhante a Html講義
[BurpSuiteJapan]HTTP基礎入門
[BurpSuiteJapan]HTTP基礎入門
Burp Suite Japan User Group
C#によるファイルの読み書き
C#によるファイルの読み書き
Hiroki Takahashi
Html s1
Html s1
Jun Chiba
Web班番外編
Web班番外編
XMLProJ2014
WEB開発はじめの一歩 講師:村井亮介様
WEB開発はじめの一歩 講師:村井亮介様
株式会社GreenHack
Web講座 第1回
Web講座 第1回
nanametown
Html1
Html1
Jun Chiba
Html入門
Html入門
GIG inc.
HTML
HTML
Jun Chiba
HTML5 for IA
HTML5 for IA
Atsushi HASEGAWA, Ph.D.
Webタグについて
Webタグについて
株式会社ジオロジック
About http
About http
RyosukeIzawa
45分で理解する webクローリング入門 斉藤之雄
45分で理解する webクローリング入門 斉藤之雄
Yukio Saito
Htmlの基本
Htmlの基本
SD Labo
Htmlの基礎
Htmlの基礎
SD Labo
Geek women japanのロゴをhtmlとcssで作る2
Geek women japanのロゴをhtmlとcssで作る2
Lina Katayose
Geek women japanのロゴをhtmlとcssで作る
Geek women japanのロゴをhtmlとcssで作る
Lina Katayose
勉強会資料①
勉強会資料①
真亮 坂口
『RESTful Web サービス』読書会 第4回 9章 説明資料
『RESTful Web サービス』読書会 第4回 9章 説明資料
Siena. N
WebMatrixに対応した、新しいけど新しくないRazor
WebMatrixに対応した、新しいけど新しくないRazor
Sho Okada
Semelhante a Html講義
(20)
[BurpSuiteJapan]HTTP基礎入門
[BurpSuiteJapan]HTTP基礎入門
C#によるファイルの読み書き
C#によるファイルの読み書き
Html s1
Html s1
Web班番外編
Web班番外編
WEB開発はじめの一歩 講師:村井亮介様
WEB開発はじめの一歩 講師:村井亮介様
Web講座 第1回
Web講座 第1回
Html1
Html1
Html入門
Html入門
HTML
HTML
HTML5 for IA
HTML5 for IA
Webタグについて
Webタグについて
About http
About http
45分で理解する webクローリング入門 斉藤之雄
45分で理解する webクローリング入門 斉藤之雄
Htmlの基本
Htmlの基本
Htmlの基礎
Htmlの基礎
Geek women japanのロゴをhtmlとcssで作る2
Geek women japanのロゴをhtmlとcssで作る2
Geek women japanのロゴをhtmlとcssで作る
Geek women japanのロゴをhtmlとcssで作る
勉強会資料①
勉強会資料①
『RESTful Web サービス』読書会 第4回 9章 説明資料
『RESTful Web サービス』読書会 第4回 9章 説明資料
WebMatrixに対応した、新しいけど新しくないRazor
WebMatrixに対応した、新しいけど新しくないRazor
Último
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NTT DATA Technology & Innovation
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
sn679259
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
atsushi061452
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
CRI Japan, Inc.
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Hiroshi Tomioka
Utilizing Ballerina for Cloud Native Integrations
Utilizing Ballerina for Cloud Native Integrations
WSO2
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
iPride Co., Ltd.
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
CRI Japan, Inc.
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
Toru Tamaki
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
Toru Tamaki
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
iPride Co., Ltd.
新人研修 後半 2024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
iPride Co., Ltd.
Último
(12)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Utilizing Ballerina for Cloud Native Integrations
Utilizing Ballerina for Cloud Native Integrations
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
Html講義
1.
HTML講義
2.
アウトライン HTMLとは タグ概説
ブロックレベル要素とインライン要素とその中間 CSS ブラウザ依存問題
3.
HTMLとは(1) HyperText Markup
Language の頭字語 HyperTextとは、ハイパーリンクを備えた文書のこと 当初の目的は、論文を掲載すること 国際研究機関の中で、各研究者が論文を書く にあたり、参照や引用ができるように作られ た
4.
HTMLとは(2) 仕組み クライアント(依頼者)はサーバ(提供者) に文書を請求する。ブラウザ(閲覧ソフト) が構造を解析し、ディスプレイに表示する
5.
タグ概説(1) HTMLは、文の中に、”<“,”>”で区切られた タグを設置することで、表現する タグは、始まりと終わりを持つものと、 一個づつ独特に使うものがある 始まりと終わりがある
<html> <head> <body> <div> <p> <font> <a> 一個づつ使う <br> <hr> <meta> <link> <img> <input> <col>
6.
タグ概説(2) HTMLの構造 <html> <head> <title>HTMLへようこそ</title> </head> <body> <div> <h1>HTMLへようこそ</h1> <p>HTMLは、 <a href=“http://ja.wikipedia.org/wiki/SGML”>SGML</a> アプリケーションの一つで、ハイパーテキストを利用してワールド ワイドウェブ上で情報を発信するために作られ、ワールドワイド ウェブの<strong>基幹的役割</strong>をなしている。情報を 発信するための文書構造を定義するために使われ、ある程度機械が 理解可能な言語で、写真の埋め込みや、フォームの作成、 ハイパーテキストによるHTML間の連携が可能である。</p> </div> </body> </html> <html> タ グ ル ー ト 要 素 <head>タグ
ヘッダー <body>タグ 本文
7.
タグ概説(3)ーヘッダー要素 このHTML文書のタイトルと、 文書にまつわるメタ情報を記載する箇所 記述できる代表的要素 一個づつ使う title 文書のタイトル link
参考参照先 meta 文書で使用する文字コードや文書に関する要約文、 キーワード、作者情報など object ページ上で動作させる外部アプリケーション script この文書のみに有効なスクリプトなど style この文書のみに有効なデザイン設定など
8.
タグ概説(4) -本文 ユーザーが実際に目にする内容を記述する <body> <div> <h1>HTMLへようこそ</h1> <p>HTMLは、 <a
href=“http://ja.wikipedia.org/wiki/SGML”>SGML</a> アプリケーションの一つで、ハイパーテキストを利用してワールド ワイドウェブ上で情報を発信するために作られ、ワールドワイド ウェブの<strong>基幹的役割</strong>をなしている。情報を 発信するための文書構造を定義するために使われ、ある程度機械が 理解可能な言語で、写真の埋め込みや、フォームの作成、 ハイパーテキストによるHTML間の連携が可能である。</p> </div> </body>
9.
ブロックレベル要素と インライン要素とその中間(1) 本文の中でタグは2つの要素に分けられる ブロックレベル要素 <p>
<div> <table> <dl> <ul> <ol> <form> <address> <blockquote> <h1> <h2> <h3> <h4> <h5> <h6> <fieldset> <hr> <pre> インライン要素 <a> <font> <small> <strong> <i> <b> <span> インラインブロック要素 <button> <img> <input> <object> <select>
10.
ブロックレベル要素と インライン要素とその中間(2) ブロックレベル要素 文中の塊を表す要素 本文の中で矩形領域(四角形)を持つ 指定がなければ前要素から改行される インライン要素 文中の一部分に意味づけする要素 改行は位置は、親要素の大きさによる インラインブロック要素
インライン要素のように改行は伴わない のですが、幅や高さを持つ 見た目に関する決まり事はブロックレベ ル要素、文法上はインライン要素 それぞれの違い
11.
ブロックレベル要素と インライン要素とその中間(3) 親子関係 親要素 子要素(孫にとっての親要素) 孫要素 ブロックレベルの中のインライン要素の間でも、 親子関係になる場合がある 水平 <i>イタリック</i>
<b>ボールド</b> 親子 <i>イタリック<b>ボールド</b> </i>
12.
CSS(1)- CSS前史 HTMLは論文を記述することに特化した言語 ↓ ウェブ向けのデザイン要件を追加 ↓ 文書の構造とデザインの設定が混在 ↓ 大混乱 ↓ 文書の構造とデザインを分けよう! ↓ CSSの導入
13.
CSS(2)ーCSSとは Cascading Style
Sheets カスケーディング・スタイル・シート ヘッダー要素の中で、使用するCSSへのリン クを掲示し、 ウェブサイトの中のデザインを集中管理
14.
CSS(3)ーCSSの書き方 セレクタ、プロパティ、値 例えば、bodyタグ内の領域で、文字のサイズを指定し たい場合、以下のように設定する。 セレクタ { プロパティ:値; } セレクタはスタイルを適用したい範囲、 tagやid、classなどを指定できる body
{ font-size:14px; }
15.
ブラウザ依存問題 以上のように、HTMLやCSSには決まり(仕様) があるが、必ずしもすべてのブラウザで同じ ようにみえるわけではない。 バグの場合もあるし、仕様の場合もある。 その原因は(主に)レンダリングエンジン (下表の右側)が異なるため 最低でも、IE(Win),Safari(Mac),Chromeは確認したい Internet
Explorer Trident Safari Webkit Google Chrome、Opera Blink Firefox Gecko
16.
ありがとうございました HTMLとは タグ概説
ブロックレベル要素とインライン要素とその中間 CSS ブラウザ依存問題 小城 順哉 shunzai3@gmail.com
Baixar agora