ホームページ > 記事 > ウェブフロントエンド > HTML5学習ノート1_html/css_WEB-ITnose

HTML5学習ノート1_html/css_WEB-ITnose

WBOYオリジナル: 2016-06-24 11:48:02869ブラウズ

1.HTML5 概要

html4 および xhtml1.0 以降のハイパーテキストマークアップ言語の最新バージョン。
最も重要な 3 つのテクノロジー: html5 コア仕様 (タグ要素)、CSS3、JavaScript
2008 年に主に機能を完成させるためにリリースされました。
特徴: 1. 下位互換性; 2.ユーザー第一、 4. プラグイン不要のパラダイム (フラッシュプラグイン)、 6. 参照セマンティクス、 8. プログラム可能なコンテンツの導入。 sublime text3、Soda Dark3 ソフトウェアインターフェイステーマ。

2.基本フォーマット

//文書型宣言
//言語を設定

//エンコーディングを設定します
基本形式

Baidu< ;/a>

要素タグ

1 単一タグ

2. 二重タグ
要素、属性、値、 text

head 要素 //ページは表示されません

メタデータコンテンツを含め、ブラウザに情報を提供するために使用されます。メタデータには、、、

、<が含まれます。 ;style>,<title><p> <br>body 要素 // ページに表示されます </p> <p>3. Text 要素 </p> <p> </p> <table>要素名 <tr> <td>Description</td> <td>説明 </td> <td> </td>a</tr> <tr> ハイパーを生成リンク <td> </td> <td> </td> <td> </td>br</tr> <tr>強制改行<td> </td> <td> </td> <td> </td>wbr</tr> <tr>安全な改行<td> </td>en<td> </td> <td> </td>b</tr> <tr> 実際の効果は太字です<td> </td> <td> </td>強い<td> </td>重要という意味</tr> <tr> bと同じですが、重要な単語を強調します<td> </td> <td> </td>i<td> </td>外国語または科学用語を意味します</tr> <tr> <td> </td> <td> </td>em<td> </td>強調を意味します</tr> <tr> <td> </td> <td> </td>code<td> </td> はコンピューターコード </tr> を意味します<tr> en<td> </td> <td> </td>var<td> </td> はプログラムの出力を表します </tr> <tr> en<td> </td> <td> </td>samp<td> </td> は変数を表します </tr> <tr> en<td> </td> <td> </td>kdb <td> </td> はユーザー入力を意味します </tr> <tr> en<td> </td> <td> </td>abbr<td> </td> は略語を意味します</tr> <tr> <td> </td> <td> </td>cite<td> </td> 他の作品のタイトルを表します </tr> <tr> 実際の機能は太字にすることです <td> </td> <td> </td>del<td> </td> 削除されたテキストを表します </tr> <tr> <td> </td> <td> </td>s<td> </td>テキストが確認されなくなったことを示します</tr> <tr> <td> </td> <td> </td>dfn<td> </td> は用語の定義を意味します </tr> <tr> <td> </td> <td> </td>mark<td> </td> は別のコンテキストに関連するコンテンツを意味します </tr> <tr> をマークするために使用されますq<td> </td>他所から引用した内容を示します<td> </td> <td> </td> </tr> <tr> rp<td> </td> ルビと一緒に使用、括弧付き <td> </td> <td> </td> </tr> <tr>rt<td> </td> ルビ付き、括弧付き <td> </td> <td> </td> </tr> <tr>ruby<td> </td> 表中の意味発音記号 <td> </td> イタリア語の上または右text 非西洋言語のサポート<td> </td> </tr> <tr>bdo<td> </td>テキストの方向を制御<td> </td> <td> </td> </tr> <tr>small<td> </td>小さなフォントコンテンツを表現<td> </td> <td> </td> </tr> <tr>sub <td> </td> 下付きフォントを示します <td> </td>sub、sup実際には数学の上付き文字と下付き文字です <td> </td> </tr> <tr>sup<td> </td> は上付きフォントを意味します <td> </td> <td> </td> </tr> <tr>time<td> </td> は時間または日付を意味します <td> </td> <td> </td> </tr> <tr>u <td> </td>強調せずにテキストの一部にマークを付けます<td> </td> <td> </td> </tr> <tr>span<td> </td> セマンティクスを持たないユニバーサル要素。通常は CSS の変更で使用されます <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> </tr> <tr> <td></td> <td> </td> <td></td> </tr> </table> <p class="sycode"></p> <p class="sycode"></p> <p class="sycode"></p> <p class="sycode"></p> <p class="sycode"></p></div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>声明：</span><div>この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。</div></div></div><div class="nphpSytBox"><span>前の記事：<a class="dBlack" title="バックエンドプログラマーがフロントエンド (CSS) について語るレッスン 1: CSS の概要_html/css_WEB-ITnose" href="http://m.php.cn/ja/faq/274656.html">バックエンドプログラマーがフロントエンド (CSS) について語るレッスン 1: CSS の概要_html/css_WEB-ITnose</a></span><span>次の記事：<a class="dBlack" title="バックエンドプログラマーがフロントエンド (CSS) について語るレッスン 1: CSS の概要_html/css_WEB-ITnose" href="http://m.php.cn/ja/faq/274658.html">バックエンドプログラマーがフロントエンド (CSS) について語るレッスン 1: CSS の概要_html/css_WEB-ITnose</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>関連記事</h2><em><a href="http://m.php.cn/ja/article.html" class="bBlack"><i>続きを見る</i><b></b></a></em><div class="clear"></div></div><ul class="nphpXgwzList"><li><b></b><a href="http://m.php.cn/ja/faq/348757.html" title="HTMLの知識のまとめ" class="aBlack">HTMLの知識のまとめ</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ja/faq/348804.html" title="HTMLを早く学ぶ方法" class="aBlack">HTMLを早く学ぶ方法</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ja/faq/348873.html" title="html xhtml xml の違い" class="aBlack">html xhtml xml の違い</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ja/faq/348884.html" title="src 属性と href 属性の違い" class="aBlack">src 属性と href 属性の違い</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ja/faq/348902.html" title="HTML5とCSSの置き換え利用について" class="aBlack">HTML5とCSSの置き換え利用について</a><div class="clear"></div></li></ul></div></div><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>福祉オンライン PHP トレーニング，PHP 学習者の迅速な成長を支援します！</p></div><div class="footermid"><a href="http://m.php.cn/ja/about/us.html">私たちについて</a><a href="http://m.php.cn/ja/about/disclaimer.html">免責事項</a><a href="http://m.php.cn/ja/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved </p></div></div></footer><script>isLogin = 0;jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了，就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}});