目次
html 操作アイデア
フォント タグ
注释
列表标签
图像标签
路径(相对路径)
超链接标签
表格标签
html的五个规范
表单标签
html中其它的常用标签的使用
html头标签的使用
框架标签的使用
HTML ヘッダー タグの使用
フレームタグ
ホームページ ウェブフロントエンド htmlチュートリアル JavaWeb の HTML の基本学習を詳しく紹介します。

JavaWeb の HTML の基本学習を詳しく紹介します。

Jul 24, 2017 pm 01:49 PM
html javaweb web

JavaWeb01_html 基本

html 操作アイデア

  • タグを使用して操作するデータをラップし、タグの属性値を変更することでタグ内のデータ スタイルを変更します

フォント タグ

  • 属性:サイズ 値の範囲 1 ~ 7 色: 英単語、16 進数 #ffffff

タイトルタグ <h1></h6>

<h1> </h1> ... <h6> </h6>

  • 从h1到h6越来越小,自动换行

注释

  • <!-- html的注释 -->

列表标签

  • <dl> <dt></dt> <dd></dd> </dl>

  • 有序

  • 无序

图像标签

  • <img src="图片的路径" width="" height="" alt="" />

  • alt:浏览器的兼容性很差

路径(相对路径)

  • 在同一级目录:直接写

  • 在下一层目录:images/1.jpg

  • 在上层目录: ../

超链接标签

<a href="路径">显示在页面上的内容</a>

  • 打开方式 target=”_self _blank”

  • 默认是在当前页面打开

表格标签

<table>
    <tr>
        <td></td>
        <th></th>   <!--加粗和居中-->
    </tr>
</table>
ログイン後にコピー

html的五个规范

  • 一个html文件开始标签和结束的标签<html></html>

  • html包含两部分内容

    • <head>设置相关信息</head>

    • <body>显示在页面上的内容都写在body里面</body>

  • html的标签是成对的

  • html的代码不区分大小写

  • 有些标签,在标签内结束。比如换行:<br /> 分割线:<hr />

表单标签

  • 可以提交数据到服务器,这个过程可以用表单标签实现

  • <form></form>

    • get请求地址栏会携带提交的数据,post不会携带

    • get请求安全级别较低,post较高

    • get请求数据大小的限制,post没有限制

    • 常用的有两种 get和post get默认就是get请求

    • action:提交到地址,默认提交到当前页面

    • method:表单的提交方式

    • enctype: 一般请求下不需要这个属性,做文件上传时候需要设置这个属性

    • 面试题目:get和post区别

  • 输入项:可以输入内容过选择内容的部分

    • 普通输入项:<input type="text"/>

    • 密码输入项:<input type="password"/>

    • 单选输入项:<input type="radio"/>
      -> 在里面需要属性name
      -> name的属性值必须要相同
      -> 必须有一个value值

    • 复选输入项:<input type="checkbox"/>
      -> 在里面需要属性name
      -> name的属性值必须要相同
      -> 必须有一个value值

    • 文件输入项(在后面上传时侯用到)
      -> <input type="file"/>

    • 下拉输入项(不是在input标签里面的)

      <select name="birth">
          <option value="0">请选择</option>
          <option value="1991">1991</option>
          <option value="1991">1992</option>
          <option value="1991">1993</option>
          <option value="1991">1994</option>
      </select>
      ログイン後にコピー
    • 文本域

    • <textarea cols="10" rows=""></textarea>
      ログイン後にコピー
    • 隐藏项(不会显示在页面上,但是存在于html代码里面)

    • <input type="hidden"/>
      ログイン後にコピー
    • 提交按钮

    • <input type="submit"/>
      <input type="submit" value="注册"/>
      ログイン後にコピー
    • 使用图片提交

    • <input type="image" src="a.jpg"/>
      ログイン後にコピー
    • 大部分的输入项使用 <input type="输入项的类型"/>

html中其它的常用标签的使用

  • b –加粗

  • s –删除线

  • u –下划线

  • i –斜体

  • pre –原样输出

  • subsup

    🎜 h1 から h6 までどんどん小さくなり、自動行折り返し🎜🎜🎜🎜 comments🎜🎜🎜🎜<!--html comments-->🎜🎜🎜🎜タグのリスト🎜🎜 🎜🎜<dl> <dt></dd>🎜🎜🎜注文済み🎜🎜🎜 🎜画像タグ🎜🎜🎜🎜<img src="画像パス" width="" height="" alt="" />🎜🎜🎜🎜alt:Browse サーバーの互換性は非常に貧弱です 🎜🎜🎜🎜パス(相対パス) 🎜🎜🎜🎜を同じレベルのディレクトリに:直接書きます 🎜🎜🎜🎜を下位のディレクトリに:images/1.jpg 🎜🎜🎜🎜を上位のディレクトリに: 。 . /🎜🎜🎜🎜ハイパーリンク タグ🎜🎜<a href="path">ページに表示されるコンテンツ</a>🎜🎜🎜🎜 target="_self _blank" で開きます 🎜🎜 🎜🎜デフォルトは現在のページで開きます🎜🎜🎜🎜テーブルタグ🎜rrreee🎜htmlの5つの仕様🎜🎜🎜🎜HTMLファイルの開始タグと終了タグ<html> ></html>🎜🎜🎜🎜html にはコンテンツの 2 つの部分が含まれています🎜🎜
      🎜🎜<head>関連情報を設定します</head>🎜🎜🎜🎜<body>本文にはページに表示される内容が記述されます</body>🎜🎜🎜🎜🎜html タグはペアになっています🎜🎜🎜🎜html コードでは大文字と小文字が区別されません🎜🎜🎜🎜一部のタグはタグ内で終了します。たとえば、改行: <br /> 区切り行: <hr />🎜🎜🎜🎜フォームタグ🎜🎜🎜🎜は、このプロセスは、フォームタグ🎜🎜🎜🎜<form>および</form>を使用して実現できます🎜🎜
        🎜🎜get リクエストのアドレス バーには送信されたデータが含まれますが、post にはデータが含まれません🎜🎜🎜🎜get リクエストのセキュリティ レベルは低く、post のセキュリティ レベルは高くなります🎜🎜🎜🎜 get リクエストのデータ サイズ制限、post には制限はありません🎜🎜🎜🎜 一般的に使用される get と post の 2 つがデフォルトで Get リクエストです🎜🎜🎜🎜 アクション: アドレスに送信し、現在のページに送信します。 default🎜🎜🎜🎜method: フォーム送信メソッド🎜🎜🎜🎜enctype : この属性は一般的なリクエストには必要ありません🎜🎜🎜🎜インタビューの質問: get と post の違い🎜🎜🎜 🎜🎜入力項目:内容を入力し、内容部分を選択できます🎜🎜
          🎜🎜通常の入力項目:&lt ;input type="text"/>🎜🎜🎜🎜パスワード入力項目: <input type="password"/>🎜🎜🎜🎜ラジオ入力項目: <input type="radio"/>
          -> 内には属性名が必要です。
          -> 名前の属性値は同じである必要があります。 >-> 値が必要です 🎜🎜🎜🎜入力項目を確認してください: <input type="checkbox"/>
          -> 属性名が必要です。 br/>-> name の属性値は同じである必要があります。
          -> ファイル入力項目 (後でアップロードするときに使用します) が必要です。
          -> <input type="file"/>🎜🎜🎜🎜ドロップダウン入力項目 (input タグ内ではありません)
          🎜rrreee🎜🎜🎜テキストフィールド
          🎜🎜🎜rrreee 🎜🎜🎜非表示の項目 (ページには表示されませんが、HTML コードには存在します)
          🎜 🎜🎜rrreee🎜🎜🎜送信ボタン
          🎜🎜🎜rrreee🎜🎜🎜画像送信を使用する
          🎜🎜🎜rrreee🎜🎜🎜入力項目のほとんどは<input type="入力項目「/>」を使用しています🎜🎜🎜🎜🎜HTMLでの他の一般的なタグの使用🎜 🎜🎜🎜b – 太字🎜🎜🎜🎜s – 取り消し線🎜🎜🎜🎜u – 下線🎜🎜🎜🎜i – イタリック体 🎜🎜🎜🎜<code>pre – そのまま出力 🎜🎜🎜🎜 sub および sup – 下付き文字と上付き文字 🎜
  • div – 自動行折り返し div –自动换行

  • span –在一行显示

html头标签的使用

  • html两部分组成 head和body

    • 可以使用link标签引入css文件

    • 可以统一设置超链接的打开方式<base target="_blank" /> –设置全文超链接以新窗口打开

    • <meta name="keywords" content="学习,熊出没"> –以前的搜索引擎检索方式

    • <meta http-equiv="refresh" content="3; url="/> –三秒跳转

    • 在head里面的标签就是头标签

    • title标签:表示在标签上显示的内容

    • 标签:设置页面的一些相关的内容

    • base标签:设置超链接的基本设置

    • link标签:引入外部文件

框架标签的使用

使用框架标签的时候,不能写在body里面,使用了框架标签,需要把body去掉

  • <frameset>标签

    • rows:按照行进行划分 <frameset rows="80, *">

    • cols:按照列进行划分 <frameset cols="80, *">

  • <frame>标签

    • <frame name="lower_left" src="b.html">

    • span – 1 行で表示

    • HTML ヘッダー タグの使用

      html は頭と体の 2 つの部分で構成されます🎜🎜
        🎜🎜 link タグを使用して CSS ファイルを導入します 🎜🎜🎜🎜 はハイパーリンクの開き方を統一的に設定できます <base target="_blank" /> – 新しいウィンドウで開くように全文ハイパーリンクを設定します🎜🎜🎜🎜<meta name="keywords" content="調査、クマが出没しています"> – 以前の検索エンジンの検索方法 🎜🎜🎜🎜<meta http-equiv ="refresh" content="3; url= "/> - 3 秒ジャンプ🎜🎜🎜🎜head 内のタグが head タグです🎜🎜🎜🎜title タグ: に表示される内容を示しますタグ🎜🎜🎜🎜 タグ: 設定 ページのいくつかの関連コンテンツ🎜🎜🎜🎜ベースタグ: ハイパーリンクの基本設定を設定します🎜🎜🎜🎜リンクタグ: 外部ファイルを導入します🎜🎜🎜🎜

        フレームタグ

        🎜フレームタグを使用する場合、ボディに記述することはできません、フレームタグが使用されているため、ボディを削除する必要があります🎜
          🎜🎜&lt ;frameset> タグ🎜🎜
            🎜🎜rows: 行に従って分割します<frameset rows= "80, *">🎜🎜🎜🎜cols: 列で分割 <framesetcols="80, *">🎜🎜🎜🎜🎜<frame&gt ;ラベル 🎜🎜
              🎜🎜<frame name=" lower_left" src="b. html">🎜🎜🎜🎜詳細表示🎜🎜🎜🎜のページ

      以上がJavaWeb の HTML の基本学習を詳しく紹介します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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

    ホットAIツール

    Undresser.AI Undress

    Undresser.AI Undress

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

    AI Clothes Remover

    AI Clothes Remover

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

    Undress AI Tool

    Undress AI Tool

    脱衣画像を無料で

    Clothoff.io

    Clothoff.io

    AI衣類リムーバー

    AI Hentai Generator

    AI Hentai Generator

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

    ホットツール

    メモ帳++7.3.1

    メモ帳++7.3.1

    使いやすく無料のコードエディター

    SublimeText3 中国語版

    SublimeText3 中国語版

    中国語版、とても使いやすい

    ゼンドスタジオ 13.0.1

    ゼンドスタジオ 13.0.1

    強力な PHP 統合開発環境

    ドリームウィーバー CS6

    ドリームウィーバー CS6

    ビジュアル Web 開発ツール

    SublimeText3 Mac版

    SublimeText3 Mac版

    神レベルのコード編集ソフト(SublimeText3)

    HTMLの表の境界線 HTMLの表の境界線 Sep 04, 2024 pm 04:49 PM

    HTML の表の境界線に関するガイド。ここでは、HTML でのテーブルの境界線の例を示しながら、テーブル境界線を定義する複数の方法について説明します。

    HTML 左マージン HTML 左マージン Sep 04, 2024 pm 04:48 PM

    HTML マージン左のガイド。ここでは、HTML margin-left の概要とその例、およびそのコード実装について説明します。

    HTML のネストされたテーブル HTML のネストされたテーブル Sep 04, 2024 pm 04:49 PM

    これは、HTML でのネストされたテーブルのガイドです。ここでは、テーブル内にテーブルを作成する方法をそれぞれの例とともに説明します。

    HTML テーブルのレイアウト HTML テーブルのレイアウト Sep 04, 2024 pm 04:54 PM

    HTML テーブル レイアウトのガイド。ここでは、HTML テーブル レイアウトの値と例および出力について詳しく説明します。

    HTML入力プレースホルダー HTML入力プレースホルダー Sep 04, 2024 pm 04:54 PM

    HTML 入力プレースホルダーのガイド。ここでは、コードと出力とともに HTML 入力プレースホルダーの例について説明します。

    HTML 順序付きリスト HTML 順序付きリスト Sep 04, 2024 pm 04:43 PM

    HTML 順序付きリストのガイド。ここでは、HTML 順序付きリストと型の導入とその例についても説明します。

    HTML 内のテキストの移動 HTML 内のテキストの移動 Sep 04, 2024 pm 04:45 PM

    HTML でのテキストの移動に関するガイド。ここでは、概要、マーキー タグが構文でどのように機能するか、および実装例について説明します。

    HTML の onclick ボタン HTML の onclick ボタン Sep 04, 2024 pm 04:49 PM

    HTML オンクリック ボタンのガイド。ここでは、それらの紹介、動作、例、およびさまざまなイベントでの onclick イベントについてそれぞれ説明します。

    See all articles