前端學習之HTML(第一天)

什么是HTML

HTML是一種用來描述網頁的一種語言,HTML不是一種編程語言,而是一種標記語言。

HTML標簽

HTML 標簽是由尖括號包圍的關鍵詞,比如 <html>

HTML 標簽通常是成對出現的,比如 <b> 和 </b>

標簽對中的第一個標簽是開始標簽,第二個標簽是結束標簽

開始和結束標簽也被稱為開放標簽和閉合標簽

瀏覽器

瀏覽器用于讀取HTML文件,并將器作為網頁顯示。

<!DOCTYPE>聲明

作用是用來告訴瀏覽器,我這是什么文檔,該如何解析。

(注:<!DOCTYPE>不區分大小寫)

HTML標簽

語法結構<標簽 屬性=“值”>內容</標簽>

標簽不區分大小寫

例子

里面的注釋是各個標簽的用法

<!DOCTYPE html>
<!-- html是每個html文件都會有的一個標簽,文件所有內容都寫在html中間 -->
<html>
<!-- head是頭部,這個里面都寫的是藐視當前網頁屬性的一些東西,并不顯示在頁面上 -->
<head><meta charset="utf-8"><!-- title顯示當前頁面標題 --><title>這是第一個網頁</title><!-- style寫css代買在這寫 --><style>body{/* 背景顏色變為黑色 */background-color: wheat;}</style><!-- 寫js的在這里寫 --><script type="text/javascript"></script>
</head>
<!-- body是身體,這里是用來描述網頁的代碼 -->
<body>
<!-- p標簽用來分段 -->
<!-- aligen將內容調位置 -->
<!-- strong和b都是加粗,一個是語義化標簽,可以區分一些標簽搜索的時候更方便,實際兩者無區別 -->
<!-- i/em可以讓字體變斜 -->
<!-- u可以加粗 -->
<!-- del刪除線 -->
<!-- 段落內br換行,會繼承原有段落的性 -->
<!-- hr分割線 -->
<!-- span和div是用來區分塊的,用來布局頁面。span是行內標簽內容在一行,div塊標簽要換行, -->
<!-- sub下標,sup上標 -->
<!-- h1、h2、h3、h4不同級別標題 -->
<!--pre里面咋寫內容咋顯示-->
<p align="center">這是第一個<b>網頁內容</b></p>
<p align="left">這是第一個<strong>網頁內容</strong></p>
<p align="right">這是<i>第一個</i>網頁內容</p>
<p align="right">這是<em>第一個</em>網頁內容</p>
<p align="right">這是第一個<u>網頁</u>內容</p>
<p>這是第<del>一個</del>網頁內容</p>
<hr />
<p>這是第一個網頁這是第一個網頁這是第一個網頁這是第一個網頁
</p>
<p>這是第一個網頁<br />這是第一個網頁<br />這是第一個網頁<br />這是第一個網頁<br />
</p>
<hr />
<p>lalalalaalasdflasdfasdfa
</p>
<pre>lalalalaalasdflasdfasdfa</pre>
<hr />
<!-- 加一個邊框 -->
<span style="border: 1px solid red;">111111</span>
<span style="border: 1px solid green;">111111</span>
<div style="border: 1px solid red;">22222</div>
<div style="border: 1px solid red;">22222</div>
a<sub>2</sub>
<h1>第一</h1>
<h2>第一</h2>
<h3>第一</h3>
<h4>第一</h4>
</body>
</html>

結果


不嫌棄的點點關注,點點贊 ?(?ˊ?ˋ)?* ???????

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/719721.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/719721.shtml
英文地址,請注明出處:http://en.pswp.cn/news/719721.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

ROS 2基礎概念#3:主題(Topic)| ROS 2學習筆記

在ROS&#xff08;Robot Operating System&#xff09;中&#xff0c;主題&#xff08;Topics&#xff09;是實現節點之間通信的主要機制之一。節點&#xff08;Node&#xff09;可以發布&#xff08;publish&#xff09;消息到話題&#xff0c;或者訂閱&#xff08;subscribe&…

市場復盤總結 20240304

僅用于記錄當天的市場情況&#xff0c;用于統計交易策略的適用情況&#xff0c;以便程序回測 短線核心&#xff1a;不參與任何級別的調整&#xff0c;采用龍空龍模式 一支股票 10%的時候可以操作&#xff0c; 90%的時間適合空倉等待 二進三&#xff1a; 進級率中 20% 最常用的…

格兩例12345

osu/Lucky Roll gaming 周末osu有道題&#xff1a;lcg已知低位 def lcg(s, a, b, p):return (a * s b) % pp getPrime(floor(72.7)) a randrange(0, p) b randrange(0, p) seed randrange(0, p) print(f"{p }") print(f"{a }") print(f"{b …

冪等性設計

目錄 前言 冪等性設計 冪等性設計處理流程 HTTP 冪等性 消息隊列冪等性 基于kafka 前言 冪等性設計&#xff0c;就是說&#xff0c;一次和多次請求某一個資源應該具有同樣的副作用。為什么我們要有冪等性操作&#xff1f;說白了&#xff0c;就兩點&#xff1a;1、網絡的…

LeetCode第125場雙周賽個人題解

目錄 100231. 超過閾值的最少操作數 I 原題鏈接 思路分析 AC代碼 100232. 超過閾值的最少操作數 II 原題鏈接 思路分析 AC代碼 100226. 在帶權樹網絡中統計可連接服務器對數目 原題鏈接 思路分析 AC代碼 100210. 最大節點價值之和 原題鏈接 思路分析 AC代碼 10023…

大話C++之:對象內存模型

一般繼承(無虛函數覆蓋) 只有一個虛指針&#xff0c;指向一個虛表&#xff0c;虛函數按順序從祖先節點開始插入到虛表上。字段按順序從祖先節點開始插入到對象內存上 一般繼承(有虛函數覆蓋) 只有一個虛指針&#xff0c;指向一個虛表&#xff0c;虛函數按順序從祖先節點開始&a…

桂院校園導航 靜態項目 二次開發教程 2.0

Gitee代碼倉庫&#xff1a;桂院校園導航小程序 GitHub代碼倉庫&#xff1a;GLU-Campus-Guide 靜態項目 2.0版本 升級日志 序號 板塊 詳情 1 首頁 重做了首頁&#xff0c;界面更加高效和美觀 2 校園頁 新增了 “校園指南” 功能&#xff0c;可以搜索和瀏覽校園生活指南…

【金三銀四】每日一點面試題(Java--JVM篇)

1、說一下 JVM 的主要組成部分及其作用&#xff1f; JVM&#xff08;Java虛擬機&#xff09;是Java程序運行的核心組件&#xff0c;它負責將Java字節碼翻譯成底層操作系統能夠執行的指令。JVM由以下幾個主要組成部分構成&#xff1a; 類加載器&#xff08;Class Loader&#…

Modbus協議詳細解析與案例分享

目錄 Modbus協議詳細解析與案例分享1. Modbus協議簡介2. Modbus RTU和Modbus TCP的區別3. Modbus幀結構4. Modbus協議示例5. Modbus應用場景結語 Modbus協議詳細解析與案例分享 1. Modbus協議簡介 Modbus是一種串行通信協議&#xff0c;用于實現工業自動化設備之間的通信。它…

消息中間件|初識消息隊列

文章目錄 消息隊列是什么&#xff1f;消息隊列關鍵概念消息隊列優點消息隊列的應用場景異步處理應用解耦流量削峰消息通訊 常用消息隊列中間件的對比 消息隊列是什么&#xff1f; 消息隊列&#xff08;Message Queue&#xff09;是一種用于在軟件系統之間傳遞消息的通信機制。…

spring boot概述

SpringBoot是由Pivotal團隊提供的全新框架&#xff0c;其設計目的是用來簡化新Spring應用的初始搭建以及開發過程。 該框架使用了特定的方式來進行配置&#xff0c;從而使開發人員不再需要定義樣板化的配置。 通過這種方式&#xff0c;SpringBoot致力于在蓬勃發展的快速應用開發…

實時抓取SKU商品屬性詳細信息API數據接口(淘寶,某音)

item_sku-獲取sku詳細信息 taobao.item_sku詳細信息 API公共參數 請求地址: https://api-gw.onebound.cn/taobao/item_sku 名稱類型必須描述keyString是調用key&#xff08;演示示例&#xff09;secretString是調用密鑰api_nameString是API接口名稱&#xff08;包括在請求地…

設計模式學習筆記 - 設計原則 - 3.里氏替換原則,它和多態的區別是什么?

前言 今天來學習 SOLID 中的 L&#xff1a;里氏替換原則。它的英文翻譯是 Liskov Substitution Principle&#xff0c;縮寫為 LSP。 英文原話是&#xff1a; Functions that use points of references of base classes must be able to use objects of derived classes withou…

python-分享篇-生成仿微信公眾號推廣的個性二維碼(支持動態)

代碼 生成仿微信公眾號推廣的個性二維碼&#xff08;支持動態&#xff09;from MyQR import myqr # 要生成動態二維碼&#xff0c;只需要將piture參數和save_name參數設置gif動圖即可 myqr.run(wordshttps://blog.csdn.net/stqer/article/details/135553200, # 指定二維碼包含…

JVM(內存區域劃分)

JVM JVM - Java虛擬機 我們編寫的 Java 程序, 是不能夠被 OS 直接識別的 JVM 充當翻譯官的角色, 負責把我們寫的的 Java 程序 ,翻譯給 OS “聽”, 讓 OS 能夠識別我們所寫的 Java 代碼 JVM 內存區域劃分 JVM 是一個應用程序, 在啟動的時候, 會從 操作系統 申請到一整塊很大的內…

AI-RAN聯盟在MWC24上正式啟動

AI-RAN聯盟在MWC24上正式啟動。它的logo是這個樣的&#xff1a; 2月26日&#xff0c;AI-RAN聯盟&#xff08;AI-RAN Alliance&#xff09;在2024年世界移動通信大會&#xff08;MWC 2024&#xff09;上成立。創始成員包括亞馬遜云科技、Arm、DeepSig、愛立信、微軟、諾基亞、美…

【dc-dc】AP510X單路低壓差線性恒流芯片

說明 AP510X 是一系列外圍電路簡潔的單路線性 LED 恒 流芯片&#xff0c;適用于 3-60V 電壓范圍的 LED 恒流調光 領域。 AP510X 采用我司專利算法&#xff0c;可以實現高精度的恒 流效果&#xff0c;輸出電流恒流精度≤ 3 &#xff05;&#xff0c;電源供電工作 范…

【LeetCode】升級打怪之路 Day 11:棧的應用、單調棧

今日題目&#xff1a; Problem 1: 棧的應用 155. 最小棧 | LeetCode20. 有效的括號 | LeetCode150. 逆波蘭表達式求值 | LeetCode Problem 2: 單調棧 496. 下一個更大元素 I739. 每日溫度503. 下一個更大元素 II 目錄 Problem 1&#xff1a;棧 - “先進后出”的應用LC 155. 最…

【Java設計模式】五、建造者模式

文章目錄 1、建造者模式2、案例&#xff1a;共享單車的創建3、其他用途 1、建造者模式 某個對象的構建復雜將復雜的對象的創建 和 屬性賦值所分離&#xff0c;使得同樣的構建過程可以創建不同的表示建造的過程和細節調用者不需要知道&#xff0c;只需要通過構建者去進行操作 …

力扣刷題記錄--463. 島嶼的周長

題目鏈接&#xff1a;463. 島嶼的周長 - 力扣&#xff08;LeetCode&#xff09; 題目描述 我的代碼實現 class Solution {public int islandPerimeter(int[][] grid) { int result0; int rowgrid.length; int colgrid[0].length; for(int i0;i<row;i){for(int j0;j<col…