HTML初心者向け共通タグ(1) テキストtag_html/css_WEB-ITnose-htmlチュートリアル-php.cn

ホームページ

ウェブフロントエンド

htmlチュートリアル

HTML初心者向け共通タグ(1) テキストtag_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jun 24, 2016 am 11:27 AM

最近、iOS 開発の過程で、開発者としてすべての問題を克服するという原則に基づいて、JS とネイティブ OC (Swift) の間の対話が含まれることに気づき、HTML を学習し始めました。将来の復習を容易にするため、および初心者向けの参考として、ここに勉強メモを置きます。

HTML は、私がこれまでに学んださまざまなオブジェクト指向言語や関数型言語とは異なり、明確な文脈論理を持ちません。他の言語とは異なります。この文章があなたを他の言語の学習の影から遠ざけてくれることを願っています

。 1.

HTML は Web コンテンツのキャリアです

コンテンツは Web ページの作成ですユーザーが閲覧するために作成者がページに置く情報には、テキスト、写真、ビデオなどが含まれます 2.

CSS スタイルはパフォーマンス

Web ページのコートのようなものです。たとえば、タイトルのフォント、色の変更、背景画像、境界線などを追加します。これらはすべて、コンテンツの外観を変更するために使用されます。 3.

JavaScript は Web ページに特殊効果を実装するために使用されます。

例: マウスがその上をスライドするとドロップダウンメニューがポップアップします。または、マウスがその上をスライドするとドロップダウンメニューがポップアップします。テーブルの変更 (ニュース写真) のローテーションもあります。アニメーションとインタラクションは一般に JavaScript を使用して実装されていることがわかります。 HTML を初めて使用する場合。 , 私が触れたい最初の専門用語は、タグまたはセマンティクスのいずれかです。平たく言えば、セマンティクスの意味は、各タグの目的 (さまざまなタグ、それらがどのような状況で使用されるか、およびそれらの使用方法) を理解することです。 Web ページ上の記事のタイトル、Web ページに反映させたいグラフ、列名、段落など、これらはセマンティクスとして考慮する必要があるものです) はすべてタグによって実現されます。 . 基本的なタグと CSS を追加することで、非常に美しいページを作成できます。

セマンティクスの利点:

1. 検索エンジンによってインデックスされやすくなります

2. スクリーンリーダーが Web ページのコンテンツを読みやすくなります。 .

2. 最も簡単なプログラムから説明する HTML をダウンロードする

C、Java、OC などを学習しているかどうかにかかわらず、プログラマーとしては誰もが最初に書くべきだと思います。 print 関数がありますが、HTML には関数がありません。HTML はテキストエディタと同様に、適切なタグを追加することでテキストを希望どおりに配置できるため、以下の印刷関数はありません。将来的にはそれを持ってください) ).

 1 <!DOCTYPE HTML> 2 <html> 3     <head> 4         <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5         <title>我的第一个网页</title> 6     </head> 7     <body> 8         <h1 id="Hello-World">Hello World</h1> 9     </body>10 </html>

上記はHTMLのHello Worldです

このコードの簡単な紹介

まず、コードから、ほとんどのタグがペアで表示されていることがわかります、タグと終了タグに分かれており、終了タグには、上記のやのように、「/」が 1 つ多く含まれていることがわかります。コードは相互にネストして埋め込むことができますが、交差することはできません。には多くのタグのペアがネストされていますが、相互に交差するタグはありません。これは問題ありませんが、はルートタグと呼ばれます。 Web ページのタグはにあります。

タグはドキュメントの先頭を定義するために使用されます。ドキュメントの先頭には、ドキュメントのさまざまな属性と情報が記述されます。ドキュメントのタイトルを含む待機。ほとんどのドキュメントのヘッダーに含まれるデータは、実際にはコンテンツとして読者に表示されません。ヘッダータグには、タイトルタグ、JavaScript インラインタグ <script>、および CSS スタイルが含まれます。 <style> タグ、<link>、<meta> などのタグは、<title> 内に <p> で順次導入されます。 ; および < /title> タグ間のテキストコンテンツは、ブラウザのタイトルバーに表示される Web ページのタイトル情報です。Web ページの title タグは、読者や検索エンジンに内容を伝えるために使用されます。 Web ページのメインコンテンツは、Web ページにタグを付けることで、Web ページの本文が異なり、Web ページごとに固有のタイトルが必要になります。 Web ページのインターフェースに表示されるコンテンツであり、一般的なコンテンツタグには、階層型タイトルタグ <h1> ～ <h6>、段落タグ <p>、<a> などがあります。 tags&lt ;img> など。これらのタグの内容は Web ページに直接反映されます。<p> <p>　　<h1>标题标签, 网页中有很多的标题, 比如这篇博客的2, 从最简单的程序解释下HTML就是一个标题, 而标题也有着不同的大小尺寸, HTML中定义了标题的标签分别为<h1>到<h6>, 他们会默认加粗, 然后逐级减小字体. <p> <h2>　　3, 其他的标签 <p>　　<p>段落标签, 在文章中, 我们需要条理清晰的一个一个段落, 这个时候我们就需要段落标签了, 默认样式中<p>前后都会有空白, 但是并不是我们正常使用中的首行缩进, 它通常不会让我们满意, 所以我们需要用css样式(<style>标签)来删除或者改变它. <p class="sycode"> <pre class='brush:php;toolbar:false;'> 1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title> <p>标签</title> 6 </head> 7 <body> 8 <p>我的第一个段落.</p> 9 <p>我的第二个段落.</p>10 <style>11 p{12 color:#940;13 }14 </style>15 </body>16 </html></pre> <p>　　<strong>和<em>强调标签, 这两个标签用于强调网页中文本的特定词语或者段落, 但是两者在语气上有区别, <strong>更假强烈, 表现形式会是使用粗体, 而<em>会是斜体. <p>　　<span>标签, <span>标签是没有任何语义的, 大家也许会想, 那它有何作用, 但是正是因为没有语义, 才体现了它的强大之处, 也就是自定义, 它标签内的文本配合上css或者是JS能够高度的进行特定文本的自定义, 这在以后的学习中可以称之为最重要的标签之一. <p>　　<q>短引用文本标签, 这个标签比较冷门, 当你在引用某名人名言等时候, 会用到的标签, 浏览器会对你引用的文字自动加双引号, 所以你并不需要自己为之加双引号. <p>　　<blockquote>长引用文本标签, 这个和上面的标签使用同理, 但是适用于长的段落性引用, 在实际效果中会是缩进的, 单独段落的引用效果, 并不会增加双引号. <p>　　<address>地址标签, 可以定义一个地址, 可以是邮箱, 签名, 或者是文档的作者身份. 标签中的文字在浏览器上的样式默认为斜体, 使用css样式表可以自定义. <p>　　<code>代码标签, 在一些技术网站, 比如我们的博客论坛网站, 需要展示一行代码的时候, 就会用到code标签. 但是多行代码的时候就不可以了. <p>　　<pre class="brush:php;toolbar:false">代码段标签, 在需要插入大段的代码时, 需要使用<pre class="brush:php;toolbar:false">标签, 它可以将我们代码中的回车, 缩进等完整的体现出来, 避免了HTML不识别多空格和回车的问题. <p>　　空标签(单一标签, 不存在开始结束标签) <p>　　<br />换行标签, 在HTML中是不识别多空格(可以识别单个空格作为一个文本形式)和换行的, 所有的文本都会是连续的, 所以有了段落标签<p>, 空格 <br />在HTML中也就是等价于ASCII中的" \n ". <p>　　<hr />水平横线标签, 在浏览器中的默认样式线条比较粗，颜色为灰色，可能有些人觉得这种样式不美观，没有关系，这些外在样式在我们以后学习了css样式表之后，都可以对其修改。 <p>　　使用这些标签就可以完成一些简单的文本文档类的网站编辑了. <p>　　 <p> <p class="sycode"> <p class="sycode"> <p class="sycode"> <p class="sycode"> <p class="sycode"> <p class="sycode"> <p class="sycode"> <p class="sycode"> </script>

声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

HTMLの役割：Webコンテンツの構造Apr 11, 2025 am 12:12 AM

HTMLの役割は、タグと属性を使用してWebページの構造とコンテンツを定義することです。 1。HTMLは、読みやすく理解しやすいようなタグを介してコンテンツを整理します。 2。アクセシビリティとSEOを強化するには、セマンティックタグなどを使用します。 3. HTMLコードの最適化により、Webページの読み込み速度とユーザーエクスペリエンスが向上する可能性があります。

HTMLとコード：用語を詳しく見るApr 10, 2025 am 09:28 AM

htmlisaspecifictypeofcodefocuseduructuringwebcontent

HTML、CSS、およびJavaScript：Web開発者に不可欠なツールApr 09, 2025 am 12:12 AM

HTML、CSS、およびJavaScriptは、Web開発の3つの柱です。 1。HTMLは、Webページ構造を定義し、などなどのタグを使用します。2。CSSは、色、フォントサイズなどのセレクターと属性を使用してWebページスタイルを制御します。

HTML、CSS、およびJavaScriptの役割：コアの責任Apr 08, 2025 pm 07:05 PM

HTMLはWeb構造を定義し、CSSはスタイルとレイアウトを担当し、JavaScriptは動的な相互作用を提供します。 3人はWeb開発で職務を遂行し、共同でカラフルなWebサイトを構築します。

HTMLは初心者のために簡単に学ぶことができますか？Apr 07, 2025 am 12:11 AM

HTMLは、簡単に学習しやすく、結果をすばやく見ることができるため、初心者に適しています。 1）HTMLの学習曲線はスムーズで簡単に開始できます。 2）基本タグをマスターして、Webページの作成を開始します。 3）柔軟性が高く、CSSおよびJavaScriptと組み合わせて使用できます。 4）豊富な学習リソースと最新のツールは、学習プロセスをサポートしています。

HTMLでの開始タグの例は何ですか？Apr 06, 2025 am 12:04 AM

Anexampleapalofastartingtaginhtmlis、それはaperginsaparagraph.startingtagsaresentionentientiontheyinitiateelements、definetheirtypes、およびarecrucialforurturingwebpagesandcontingthomedomを構築します。

CSSのフレックスボックスレイアウトを使用して、メニューの点線のラインセグメンテーション効果のセンターアラインメントを実現する方法は？Apr 05, 2025 pm 01:24 PM

メニューで点線のラインセグメンテーション効果を設計する方法は？メニューを設計するときは、通常、皿の名前と価格の間に左右に合わせることは難しくありませんが、真ん中の点線またはポイントはどうですか...

オンラインコードエディターはコード入力を実装するためにどのようなHTML要素を使用していますか？Apr 05, 2025 pm 01:21 PM

WebコードエディターのHTML要素分析では、多くのオンラインコードエディターを使用すると、ユーザーはHTML、CSS、およびJavaScriptコードを入力できます。最近、誰かが提案した...

See all articles

ホットAIツール

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

脱衣画像を無料で

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

mPDF

mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。

SublimeText3 Linux 新バージョン

SublimeText3 Linux 最新バージョン

Dreamweaver Mac版

ビジュアル Web 開発ツール

SublimeText3 英語版

推奨: Win バージョン、コードプロンプトをサポート!

DVWA

Damn Vulnerable Web App (DVWA) は、非常に脆弱な PHP/MySQL Web アプリケーションです。その主な目的は、セキュリティ専門家が法的環境でスキルとツールをテストするのに役立ち、Web 開発者が Web アプリケーションを保護するプロセスをより深く理解できるようにし、教師/生徒が教室環境で Web アプリケーションを教え/学習できるようにすることです。安全。 DVWA の目標は、シンプルでわかりやすいインターフェイスを通じて、さまざまな難易度で最も一般的な Web 脆弱性のいくつかを実践することです。このソフトウェアは、