htmlの基本要素と各種タグ

HTML の概要

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>title</title>
</head>
<body>
 
<h1>我的第一个标题</h1>
 
<p>我的第一个段落</p>
 
</body>
</html>

要素の説明:

HTML5 ドキュメント要素が HTML ページのルート要素であることを宣言します。この要素には、Web ページのエンコード形式を utf-8 として定義するなど、ドキュメントのメタデータが含まれます。 元素描述了文档的标题 元素包含了可见的页面内容 <h1> 元素定义一个大标题 <p> 元素定义一个段落 </p></h1>
エレメント:

ラベル要素

要素は HTML ドキュメント全体を定義します。

ラベル要素

要素は HTML ドキュメントの本文を定義します。

-

ラベル要素

サイズが 1 ~ 6 に減少

<h1>这是一个标题</h1>
<h2>这是一个标题</h2>
<h3>这是一个标题</h3>

ラベル要素

段落を宣言する

 <!--style设置样式-->
 <p style="color:red;" >哈哈哈哈</p>


ラベル要素


水平線を定義する
 <p style="color:red;" >哈哈哈哈</p><hr>
  <p style="color:red;" >哈哈哈哈2</p>


ラベル要素

改行

テキスト書式タグ要素

ラベル 説明
b 太字のテキストを定義する
えっと 強調テキストを定義する
イタリック体の定義
小さい 小さなフォントを定義する
強い 強調を定義する
サブ 添え字を定義する
すする 上付き文字を定義する
インス キャレットを定義する
削除ワードを定義する

ラベル要素

src="https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics7.baidu.com%2Ffeed%2F2cf5e0fe9925bc31a19293177f1058bbc9137048.jpeg%3Ftoken%3D92e90a207b6a41c3ea25055686f26d32&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1661274000&t=e0ada1a2a7ec9d4626ed370549f3ef84" alt="new" width="304" height="228">

ラベル要素

HTML リンクはタグによって定義されます。

<a href="https://www.baidu.com">百度一下</a>

a 要素の属性:

属性 説明
クラス HTML 要素の 1 つ以上のクラス名 (classname) を定義します (クラス名はスタイル ファイルからインポートされます)。
ID 要素の一意の ID を定義します
スタイル 要素のインラインスタイルを指定します
タイトル 要素に関する追加情報を説明します (ツールバーとして使用)

タグのアンカーリンク

	 <a href="#ti">跳转到标题</a>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <h1 id="ti">我是标题</h1>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>
    <p>我是内容</p>

a要素とimg要素の組み合わせ

<a href="www.baidu.com">
        <img src="">
    </a>

スパンタグ要素

ドキュメント内のインライン要素をグループ化するために使用されます。通常、通常のテキストに対して動作します。

      <span class="haha" style="color: blue; font-size: 30px;"> 
   		<p>哈哈哈哈2</p>
    	<p>哈哈哈哈2</p>
    	<p>哈哈哈哈2</p>
    </span>

divタグ要素

コンテンツ要素の一部にスタイル変更を実装する

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Lightly-HTML-Project</title>
    <style>
        .box1{
    
    
            float: left;
        }
        .box2{
    
    
            float: right;
        }
    </style>
</head>
<body>
    <div class="box1">
        <h1>sssss</h1>
        <p>xixixi2</p>
    </div>

     <div class="box2">
        <h3>dddd</h1>
        <p>呵呵呵</p>
    </div>
</body>
</html>

おすすめ

転載: blog.csdn.net/ydl1128/article/details/126468692