htmlタグの詳しい解説(2)

Feb 16, 2017 pm 02:17 PM
htmlタグ

前回は、httpの基本的なタグであるリンクタグ、イメージタグ、HTMLフレームワークなどを中心に説明しましたが、次回はテーブルタグ、リストタグ、フォームタグを中心に詳しく解説していきます

1 : テーブルタグ l & lt; & lt;/table & gt; タグ

& lt;/TR & GT; を示すために使用されます。 & lt;/td & gt; 列を表すために使用されるラベル

ラベルは、

と同じです。 ; ただし、内部のコンテンツは自動的に拡大され、太字になります

border テーブルの幅を設定します。単位はピクセルです

width テーブルの幅を設定します、単位はピクセルです

height テーブルの高さ、単位を設定しますピクセルです

cellspacing 表の境界線の間隔を表すセル間の距離を設定します

cellpadding テキストを設定します セルの境界線からの距離

bgcolor 表の背景色を設定します

align 配置の設定に使用されます、中央、左、右など

(2) セルの結合について
<!DOCTYPE html>
    <html>
        <head>
            <!-- 原创作者:蜗牛 -->
            <title>table标签</title>
        </head>
        <body>
            <table  border="1" width="360"  height="240" 
                    cellspacing="1" cellpadding="1" 
                    align="center" bgcolor="red">   <!--这里的center表示该表格在页面的中间位置-->
                                                    <!--这里的背景色标签是bgcolor-->
                    <caption><h2>我的好朋友</caption>

                     <tr>
                         <th>姓名</th>
                 <th>性别</th>
                         <th>年龄</th>
                         <th>爱好</th>                     
                     </tr>

                     <tr align="center">          <!--这里的center表示的是表格里面的字体居中-->
                         <td>小红</td>
                         <td>女</td>
                         <td>20</td>
                         <td>跳舞</td>
                     </tr>

                     <tr align="center"> 
                         <td>小舵</td>
                         <td>女</td>
                         <td>24</td>
                         <td>唱歌</td>
                     </tr>
                    
                </table>
       </body>
    </html>
ログイン後にコピー

実行結果は以下の通りです:

注: 表の各セルに異なる内容を入力した場合、各セルのサイズを同じに保つには 2 つの方法があります。たとえば、テーブルの合計の高さが 400 で 4 行を設定し、各 に属性を追加します。 tag: hight=100; これは均等分布に相当し、同じ幅に対して同じ方法を使用します。 2: CSSのスタイルを設定してtrとtdのサイズを固定するだけなので、1つ目より簡単になります

2: リストタグ

<!DOCTYPE html>
<html>
    <head>     
        <title>table中合并单元格</title>
    </head>
    <body>
        <table  border="1" width="300"  height="200" 
                align="center" background="first.jpg" >  <!--background代表的是背景图片,bgcolor代表背景色完全不一样-->

                  <tr align="center" width="100" >
                     <td>1</td>
                     <td colspan="2">占两列</td>    <!--当colspan="2"表示在同一行中,两列并一列,那么在它下面少写一个<td></td>标签-->
                     <!-- 删除掉此<td></td> -->
                     <td>2</td>
                 </tr>

                 <tr   align="center" width="100">  
                     <td rowspan="2">占两行</td>   <!--当 rowspan="2"表示在同一列中 两行并一行,那么在同一列中删掉一个<td></td>标签-->
                     <td>3</td>
                     <td>4</td>
                     <td>5</td>
                 </tr>

                  <tr   align="center" width="100" >
                    <!-- 删除掉此<td></td> -->
                     <td>6</td>
                     <td>7</td>
                     <td>8</td>
                 </tr>          
            </table>
   </body>
</html>
ログイン後にコピー
htmlタグの詳しい解説(2)実行結果は以下の通りです

3: フォーム

フォームタグ

<!DOCTYPE html>
<html>
    <head>
    <title>列表标签</title>
    </head>
    <body  bgcolor="#FFFF00">
        <!-- 无序列表 -->
        2017年心愿
        <ul type="circle">     <!--无序序列<ul> ,无序有circle:圆点,square:小方块-->
            <li>父母身体健康</li>
            <li>宝宝健康成长</li>
            <li>媳妇健健康康</li>
        </ul>

        <!-- 有序列表 -->
        2017年大事件
        <ol type="1" start="2">   <!--有序的标签是<ol>,有序有五种:1,A,a ,i,I,start代表从什么时候开始等于2代表从2开始--> 
            <li>老婆要生小孩了</li>
            <li>自己换工作了</li>
            <li>要卖掉一套房</li>
        </ol>
        
        <!-- 自定义列表 -->
        <dl>                    <!--在自定义列表<dl> </dl>中使用<dt> </dt>表示小标题,使用<dd> </dd>表示列表项-->
            <dt>时刻告诉自己</dt>
            <dd>不抱怨</dd>
            <dd>零负能量</dd>
            <dd>该与不该</dd>
        </dl>
    </body>
</html>
ログイン後にコピー
レンダリングは以下の通りです:

htmlタグの詳しい解説(2)

htmlタグの詳しい説明は(2) 関連記事はPHP中国語サイトにご注目ください!

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、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衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

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

SublimeText3 中国語版

SublimeText3 中国語版

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

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

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

Go言語で正規表現を使用してHTMLタグの内容を抽出する方法 Go言語で正規表現を使用してHTMLタグの内容を抽出する方法 Jul 14, 2023 pm 01:18 PM

正規表現を使用して Go 言語で HTML タグのコンテンツを抽出する方法 はじめに: 正規表現は強力なテキスト マッチング ツールであり、Go 言語でも広く使用されています。 HTML タグを処理するシナリオでは、正規表現を使用すると、必要なコンテンツを迅速に抽出できます。この記事では、Go 言語で正規表現を使用して HTML タグの内容を抽出する方法と、関連するコード例を紹介します。 1. 関連パッケージの導入 まず、関連パッケージ regexp と fmt をインポートする必要があります。正規表現パッケージが提供する

Python 正規表現を使用して HTML タグを削除する方法 Python 正規表現を使用して HTML タグを削除する方法 Jun 22, 2023 am 08:44 AM

HTML (HyperTextMarkupLanguage) は、Web ページを作成するための標準言語であり、タグと属性を使用して、テキスト、画像、表、リンクなど、ページ上のさまざまな要素を記述します。ただし、HTML テキストを処理する場合、後続の処理のためにテキスト コンテンツを迅速に抽出することは困難です。現時点では、Python の正規表現を使用して HTML タグを削除し、プレーン テキストをすばやく抽出できます。 Python では、通常のテーブル

PHPの文字列からHTMLタグを削除するにはどうすればよいですか? PHPの文字列からHTMLタグを削除するにはどうすればよいですか? Mar 23, 2024 pm 09:03 PM

PHP は、Web サイト開発やバックエンド アプリケーション開発で広く使用されている、一般的に使用されるサーバー側スクリプト言語です。 Web サイトやアプリケーションを開発するとき、文字列内の HTML タグを処理する必要がある状況によく遭遇します。この記事では、PHP を使用して文字列から HTML タグを削除する方法と、具体的なコード例を紹介します。なぜ HTML タグを削除する必要があるのですか? HTML タグは、ユーザー入力やデータベースから取得したテキストを処理するときによく使用されます。テキストを表示するときにこれらの HTML タグを削除したい場合があります。

PHPでHTMLタグをエスケープする方法 PHPでHTMLタグをエスケープする方法 Feb 24, 2021 pm 06:00 PM

PHP では、htmlentities() 関数を使用して html をエスケープし、文字を HTML エンティティに変換できます。構文は「htmlentities(string,flags,character-set,double_encode)」です。 PHP の html_entity_decode() 関数を使用して、HTML をエスケープ解除し、HTML エンティティを文字に変換することもできます。

Javaで指定された文字列からHTMLタグを削除するにはどうすればよいですか? Javaで指定された文字列からHTMLタグを削除するにはどうすればよいですか? Aug 29, 2023 pm 06:05 PM

String は Java の最終クラスであり、不変です。つまり、オブジェクト自体を変更することはできませんが、オブジェクトの参照は変更できます。 String クラスの replaceAll() メソッドを使用して、特定の文字列から HTML タグを削除できます。正規表現を使用して、指定された文字列から HTML タグを削除できます。文字列から HTML タグを削除した後、文字列を通常のテキストとして返します。構文 publicStringreplaceAll(Stringregex,Stringreplacement) の例 publicclassRemoveHTMLTagsTest{&nbs

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

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

HTML テーブルで HTML タグを使用するにはどうすればよいですか? HTML テーブルで HTML タグを使用するにはどうすればよいですか? Sep 08, 2023 pm 06:13 PM

テーブルに HTML タグを簡単に追加できます。 HTML タグは <td> タグ内に配置する必要があります。たとえば、段落 <p>…</p> タグまたはその他の利用可能なタグを <td> タグ内に追加します。構文 次に、HTML テーブルで HTMl タグを使用するための構文を示します。 <td><p>コンテキストの段落</p><td>例 1 HTML テーブルでの HTML タグの使用例を以下に示します。 <!DOCTYPEhtml><html><head&g

基本的な HTML タグを検証するための PHP 正規表現メソッド 基本的な HTML タグを検証するための PHP 正規表現メソッド Jun 24, 2023 am 08:07 AM

PHP は、正規表現関数をサポートし、入力データの有効性を迅速に検証できる効率的な Web 開発言語です。 Web 開発では、HTML は一般的なマークアップ言語であり、HTML タグの検証は Web フォーム検証の非常に重要な方法です。この記事では、基本的な HTML タグの検証方法と、検証に PHP 正規表現を使用する方法を紹介します。 1. HTML タグの基本構造 HTML タグは、山括弧で囲まれた要素名と属性で構成されており、一般的なタグには p、a、div などがあります。

See all articles