ホームページ > ウェブフロントエンド > htmlチュートリアル > 実用的でクールな 5 つの HTML タグと属性の紹介_HTML/Xhtml_Web ページ制作

実用的でクールな 5 つの HTML タグと属性の紹介_HTML/Xhtml_Web ページ制作

WBOY
リリース: 2016-05-16 16:37:13
オリジナル
1435 人が閲覧しました

実は、これも見出しであり、「眩しい」とは言えないのは、私が無知で、これらのラベルを見たことがないだけです。こういった機能は通常のWebサイトではあまりないので、とても新鮮に感じます。次に、これまでに出会った優れた HTML タグをすべて記録するシリーズを作成します (おそらく HTML5 タグ。すべてのブラウザーに互換性があるという保証はありません)。

1. コンテンツ編集可能

これは HTML5 の新しいタグで、次のテーブルのような領域のコンテンツを編集できるようになります。 (IE のテーブルはこの属性をサポートしていないようですが、div と body はサポートしているようです。 IE を使用している場合は、$100 と $50 の部分をクリックして編集してください。IE 以外の場合は、すべてのコンテンツが編集可能になっているはずです。



<みんな>
毎月の節約額
貯蓄
1月
$100
2月
$50

ヒント:
を実行する前にコードの一部を変更できます。


このテーブルはテキスト ボックスを追加せずに直接編集できることに注意してください。また、サブタグでこの属性が指定されていない場合は、デフォルトで継承されるため、非常に便利です。便利。 (もちろん、この属性を本文に追加すると、すべて編集できるようになるので、本当に恐ろしいです...)

2. フィールドセットタグ

これは .NET の GroupBox に相当しますが、その機能は次の形式で関連する要素をグループ化することです。




ヒント:

を実行する前にコードの一部を変更できます。

legendタグはこのBOXのタイトルを指定します。

3. エリアタグ

画像の特定の領域にハイパーリンクを直接配置できます。 img の map タグと usemap 属性を一致させるだけです (画像をクリックして他のページにジャンプした後は、忘れずに ^_^ を返すようにしてください):



惑星

<マップ名="惑星マップ"> Sun 水星 Venus
ヒント: を実行する前にコードの一部を変更できます。

4. output标签

这个标签能够直接显示脚本的运算结果(注意:目前IE的任何版本都不支持),以下脚本似乎不工作,可能是因为WP的原因所致:



提示:您可以先修改部分代码再运行

5. mark标签

直接能够高亮一段文字,不需要把文字拆开即可实现:



提示:您可以先修改部分代码再运行

今天先到这吧,以后看到好的HTML标签和特效再贴上来。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート