主頁 > 企業開發 > HTML知識點概括——一篇文章帶你完全掌握HTML

HTML知識點概括——一篇文章帶你完全掌握HTML

2022-07-13 10:33:28 企業開發

HTML知識點概括

前端三件套分別是HTML3,CSS5,JavaScript

稍微介紹一下W3C標準:

  • 結構化標準語言(HTML)
  • 表現標準語言(CSS)
  • 行為標準(DOM,JavaScript)

HTML是超文本標記語言,負責網頁最基本資訊的構造

HTML的優勢:

  • 市場需求量
  • 跨平臺使用
  • 瀏覽器支持

我們使用的工具依舊選擇老朋友:

  • IDEA

因為內容過多,大部分內容可能都在代碼中詳細介紹,請仔細閱讀代碼

HTML基本框架

下面我們稍微介紹以下HTML的基本框架:

<!--告訴瀏覽器我們使用的標準規范-->
<!DOCTYPE html>
<html lang="en">
<!--表示網頁頭部開始-->
<head>
    <!-- meta 描述性標簽,用來描述網頁的一些資訊:例如作用等   -->
    <meta charset="UTF-8">
    <meta charset="keywords" content="第一天學習HTML">
    <meta charset="description" content="我們在這里學習HTML">

    <!-- title 標題,表示我們打開網頁后的標題   -->
    <title>我的第一個網頁</title>
</head>

<!--body 表示網頁內容開始-->
<body>
<!--內容-->
Hello,World!
</body>
</html>

其中<></>這種成對出現的標簽,我們稱為開放標簽和閉合標簽

其中<>這種單個出現的標簽,我們稱為單個標簽

塊元素和行內元素

我們簡單介紹一下塊元素和行內元素:

  • 塊元素:
    • 無論內容多少,該元素獨占一行
    • 例如:p,h1,h2
  • 行內元素:
    • 內容撐開寬度,當左右都是行內元素時,可以排在一行
    • 例如:a,strong,em

頁面結構分析

下面給出頁面結構分析:

元素名 描述
header 標記頭部區域的內容
footer 標記腳部區域的內容
section Web頁面中一塊獨立區域
article 獨立的文章內容
aside 相關內容或應用
nav 導航類輔導內容

代碼展示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>頁面結構分析</title>
</head>
<body>
<!--表示頭部-->
<head>

</head>
<!--表示獨立板塊-->
<section>

</section>
<!--表示腳部-->
<footer>

</footer>

</body>
</html>

網頁基本標簽

網頁基本資訊:

代碼 說明
<!-- --> 注釋;用來注解內容,不被編譯器讀取
<h1></h1> 大標題;分為h1~h6
<P></p> 分段符號;
<br> 換行符號;
<hr> 水平線符號;
<strong></strong> 加粗符號;
<em></em> 斜體符號;
&~~~~; 特殊符號格式;

代碼展示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>網頁基本標簽</title>
</head>
<body>
<!--我們從這里依次介紹各種標簽-->

<!--標題標簽:成對標簽;h開頭,h1~h6依次為n級標題-->
<h1>一級標簽</h1>
<h2>二級標簽</h2>
<h3>三級標簽</h3>
<h4>四級標簽</h4>
<h5>五級標簽</h5>
<h6>六級標簽</h6>

<!--然后我們介紹段落標簽:成對標簽;p-->
<!--用段落標簽后,段與段自動換行且有明顯距離-->
<p>1</p>
<p>2</p>
<p>3</p>
<!--如果不是用段標簽,即使在HTML代碼中分段,網頁中也不顯示分段-->
1
2
3

<!--接下來我們介紹換行標簽:單個標簽;br-->
<!--換行標簽使內容換行,但其本質還是在一段中,且間隔較小-->
<p>-----------------</p>
1 <br>
2 <br>
3 <br>

<!--接下來介紹水平線標簽:單個標簽;hr-->
<!--水平線標簽隨著頁面的大小改變大小,隨時充斥整個頁面-->
<hr>

<!--然后我們稍微介紹兩個字體樣式標簽,因為我們的字體樣式主要在css中寫出,這里僅簡單介紹即可-->
<!--粗體;成對標簽;strong-->
<!--斜體:成對標簽;em-->
<h1>字體樣式標簽</h1>
<p>粗體:<strong>我是粗體</strong></p>
<p>斜體:<em>我是斜體</em></p>

<!--最后我們介紹一些特殊符號:空格,大于,小于-->
<!--我們先說一下格式:&~~~;-->
<p>空格:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;空格</p>
<p>大于:&gt;</p>
<p>小于:&lt;</p>

</body>
</html>

網頁基本標簽-圖片標簽

代碼展示:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>圖片標簽</title>
</head>
<body>
<!--
我們先給出影像格式:<img src="" alt="" title=""  height="">
img:影像標簽
src:表示影像地址,可以寫絕對地址,也可以寫相對地址(推薦)
    相對地址中回傳上一級的標志是:../
alt:表示影像名稱,當影像不顯示時,直接打出影像名稱
title:當滑鼠移動上去時出現的名稱
width:寬度
height:高度
-->
<img src="https://www.cnblogs.com/Resources/picture/1.jpeg" alt="紗霧老師" title="點擊查看"  height="300">
</body>
</html>

網頁基本標簽-鏈接標簽

鏈接類標簽分為三種:

  • 1.超鏈接:
  • 2.錨鏈接:
  • 3.功能性鏈接:

代碼展示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>鏈接標簽</title>
</head>
<body>
<!--
我們先給出鏈接標簽的整個格式:<a href="" target="">鏈接文本/影像</a>
href:鏈接路徑,后面可以跟本機所創建的網頁或者互聯網上可查找網頁;且可以附帶其錨鏈接
target:在哪個視窗打開;目前我們僅需要了解兩種視窗:_blank新視窗,_self本視窗(默認)

1.超鏈接:
直接使用上方鏈接格式即可

2.錨鏈接:
需要提前用id設定錨點,然后在后續需要跳轉位置采用<a>中的#id來跳轉

3.功能性鏈接:
用于與其他設備鏈接,例如:mailto是指郵箱

-->

<!--設定錨點-->
<a id="Top">Top</a>

<!--1.超鏈接-->
<p>
<a href="E:\編程內容\HTML\code\第一部分\1.我的第一個網頁.html" target="_self">點擊進入我的第一個網頁</a>
<a href="https://www.baidu.com/" target="_blank">點擊進入百度</a>
</p>

<!--2.錨鏈接-->
<a href="https://www.cnblogs.com/qiuluoyuweiliang/p/#Top">點擊回傳頂部</a>

<!--3.功能性鏈接-->
<a href="mailto:[email protected]">點擊與郵箱互動</a>

</body>
</html>

網頁基本標簽-串列標簽

串列的定義:

  • 串列就是資訊資源的一種展示形式

串列的分類:

  • 有序串列
    • ol是有序串列的框架標簽
    • li是有序串列的內容標簽
  • 無序串列
    • ul是無序串列的框架標簽
    • li是無序串列的內容標簽
  • 自定義串列
    • dl是自定義串列的框架標簽
    • dt是自定義串列的內容標題
    • dd是自定義串列的內容標簽

代碼展示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>串列標簽</title>
</head>
<body>
<!--串列標簽分為三種:有序串列,無序串列,自定義串列-->

<!--1.有序串列:
<ol></ol>
<li></li>
-->
<ol>
    <li>Java</li>
    <li>Python</li>
    <li>Web</li>
</ol>

<hr>

<!--2.無序串列:
<ul></ul>
<li></li>
-->
<ul>
    <li>Java</li>
    <li>Python</li>
    <li>Web</li>
</ul>

<hr>

<!--3.自定義串列:
<dl>
    <dt></dt>
    <dd></dd>
    <dd></dd>
</dl>
-->
<dl>
    <dt>我是小標題</dt>
    <dd>我是串列1</dd>
    <dd>我是串列2</dd>
</dl>

</body>
</html>

網頁基本標簽-表格標簽

使用表格的好處:

  • 簡單通用
  • 結構穩定

表格的組成以及HTML中的格式:

  • 表格標簽:
  • 單元格:由行列組成
  • 行:
  • 列:
  • 跨行:rowspan=""
  • 跨列:colspan=""

代碼展示:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>表格標簽</title>
</head>
<body>

<!--表格格式:
<table></table>是基本表格框架, 其他內容需要在框架里面寫(這里提前涉及到:border表示邊框,這里設定邊框寬度border="1px"表示邊框為1像素)
<tr></tr>:行
<td></td>:列,需要寫在行中
colspan="n":表示跨列,跨n列
rowspan=“n”:表示跨行,跨n行
-->

<table border="1px">
  <tr>
    <td colspan="4">1-1</td>
  </tr>
  <tr>
    <td rowspan="2">2-1</td>
    <td>2-2</td>
    <td>2-3</td>
    <td>2-4</td>
  </tr>
  <tr>
    <td>3-1</td>
    <td>3-2</td>
    <td>3-3</td>
  </tr>
</table>
</body>
</html>

網頁基本標簽-視頻和音頻

視頻元素:

<video src="" ></video>

音頻元素:

<audio src="" ></audio>

代碼展示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>媒體標簽</title>
</head>
<body>
<!--媒體標簽:我們這里僅介紹:視頻和音頻
視頻格式:<video src="" ></video>
音頻格式:<audio src="" ></audio>
controls:表示控制面板,我們需要在媒體標簽中加入,才可以顯示控制面板
autoplay:表示自動播放,默認情況下需要手動播放
-->

<!--視頻-->
<video src="E:\編程內容\HTML\Resources\video\1.mp4" controls autoplay></video>

<!--音頻-->
<audio src="E:\編程內容\HTML\Resources\audio\1.mp3" controls autoplay></audio>
</body>
</html>

網頁基本標簽-表單

表單作用:

  • 用于收集用戶資訊

表單組成:

  • 表單域
  • 表單控制元件
  • 提示資訊

表單域

表單域是一個包含表單元素的區域

表單域格式:

<form action="" method="" name=""></form>

常用屬性:

屬性 屬性值 作用
action url地址 用于指出接收并處理表單資料的服務器程式的url地址
method get/post 用于設定表單資料的提交方式
name 名稱 用于指定表單的名稱,用來區分同一頁面的多個表單

表單掛件

最常用的表單掛件:<input type="屬性值”>

我們先介紹input內置元素:

元素 說明
type="" 表示input型別
value="" 表示input的值(內置文本)
name="" 表示input的姓名(用于同一類)
checked="" 表示被選中
maxlength="" 表示最大長度

我們再來介紹以下input的屬性包括哪些:

屬性值 說明
button 定義可點擊按鈕(配合js使用)
checkbox 定義復選框
file 定義輸入欄位和瀏覽按鈕,負責上傳檔案
hidden 定義隱藏的輸入欄位
image 定義影像形式的提交按鈕
password 定義密碼欄位,輸入內容不可見
radio 定義單選按鈕
reset 定義重置按鈕,點擊后重置表單內所有內容
submit 定義提交按鈕,點擊后將資料發送至后臺
text 定義單行輸入的欄位,默認20位元組

代碼展示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表單標簽</title>
</head>
<body>

<!--
表單標簽form
含有三種屬性:
action=“url地址”:用于指定接收并處理表單資料的服務器程式的url地址
method=“post/get”:提交方法
name=“”:表單名稱,以便于區分
-->

<form action="#" method="post" name="表單域名稱">

<!--1.<input>
格式:<input type="">
type:屬性值
name:表單元素名稱
value:表單元素默認內容
checked:默認被選中
maxlength:內容最大值
-->
<!--    text文本,用于正常書寫-->
姓名:<input type="text" value="https://www.cnblogs.com/qiuluoyuweiliang/p/請輸入姓名">
    <br>
<!--    password隱藏文本,用于書寫密碼-->
密碼:<input type="password" >
    <br>
<!--    radio單選框,用于多選一,需要配合name使用-->
性別: 男 <input type="radio" name="sex"> 女 <input type="radio" name="sex">
    <br>
<!--    checkbox多選框,用于多選,也需要配合name使用-->
愛好: 吃飯 <input type="checkbox" name="like"> 睡覺 <input type="checkbox" name="like"> 打豆豆 <input type="checkbox" name="like">
    <br>
<!--    button普通按鈕,后期搭配js使用;可以使用value定義顯示內容-->
    <input type="button" value="https://www.cnblogs.com/qiuluoyuweiliang/p/點擊發送二維碼">
    <br>
<!--    file上傳檔案-->
    <input type="file" >
    <br>
<!--    reset重置按鈕,點擊后表單內所有內容重置;可以使用value定義顯示內容-->
    <input type="reset" value="https://www.cnblogs.com/qiuluoyuweiliang/p/重新填寫">
<!--    submit點擊提交,點擊后把內容上傳給action中;可以使用value定義顯示內容-->
    <input type="submit" value="https://www.cnblogs.com/qiuluoyuweiliang/p/免費注冊">


</form>
</body>
</html>

label標記

label標記可以連接其他元素(常用于與button,checkbox,radio等點擊性標簽使用)

label格式:

<!--for對應其id值-->
<label for="~~~">內容</label>

代碼展示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>label標簽</title>
</head>
<body>
<!--當點擊相同for和id的label屬性時,會相當于點擊id屬性-->
<label for="button">點擊我為后面button畫勾</label>
<input type="checkbox" id="button">
</body>
</html>

select下拉表單

select可以單獨形成下拉表單

select格式:

<!-- 可以在里面加上selected=“selected”表示默認選擇-->
<select>
  <option selected="selected"></option>
  <option></option>
  <option></option>
</select>

代碼展示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>select標簽</title>
</head>
<body>
<!--
select作為一個框架
option作為折疊選項
可在option選項中加入selected=“selected”將其設為默認選項
-->
請選擇性別:
<select>
  <option selected="selected">請選擇</option>
    <option>男</option>
    <option>女</option>
</select>
</body>
</html>

textare文本域

textare負責創建一大片文本域,用于大規模的書寫

textare格式:

 <!--x,y分別表示 一行字數 和 行數--->
<textarea cols="x" rows="y">
      這里面寫入文本域默認顯示
</textarea>

代碼展示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>textare</title>
</head>
<body>
<!--textare
cols:表示可輸入的一行內容(不推薦使用,一般在css設定)
rows:表示存在多少列(不推薦使用,一般在css設定)
文本默認文字可以直接在里面書寫
-->
<form>
  <textarea cols="50" rows="5">
      這里面寫入文本域默認顯示
  </textarea>
</form>
</body>
</html>

HTML綜合練習

下面給出案例圖,請依照案例圖寫出相關代碼:

代碼展示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>綜合案例</title>
</head>
<body>
<!--第一步我們獲得大標題-->
<h4>青春不常在,抓緊談戀愛</h4>
<!--我們下面的內容排列整齊,這里需要采用表格實作-->
<!--表格分為n行2列-->
<table >
<!--        第一行:姓名 單選框 帶有label的字-->
    <tr>
        <td>姓名:</td>
        <td>
            <input type="radio" name="sex" id="man"> <label for="man">男</label>
            <input type="radio" name="sex" id="woman"><label for="woman">女</label>
        </td>
    </tr>
<!--    第二行:生日 下拉串列-->
    <tr>
        <td>生日:</td>
        <td>
            <select>
                <option>2000</option>
                <option>2001</option>
                <option>2002</option>
                <option>2003</option>
                <option selected="selected">請選擇年份</option>
            </select>
            <select>
                <option>1</option>
                <option>2</option>
                <option>3</option>
                <option>4</option>
                <option selected="selected">請選擇月份</option>
            </select>
            <select>
                <option>1</option>
                <option>2</option>
                <option>3</option>
                <option>4</option>
                <option selected="selected">請選擇日期</option>
            </select>
        </td>
    </tr>
<!--    第三行 所在地區 text帶value-->
    <tr>
        <td>所在地區:</td>
        <td><input type="text" value="https://www.cnblogs.com/qiuluoyuweiliang/p/填寫地區"></td>
    </tr>
<!--    第四行:婚姻狀況 單選框-->
    <tr>
        <td>婚姻狀況</td>
        <td><input type="radio" name="family"> 未婚 <input type="radio" name="family"> 已婚 <input type="radio" name="family"> 離婚 </td>
    </tr>
<!--    第五行:學歷 text-->
    <tr>
        <td>學歷:</td>
        <td><input type="text"></td>
    </tr>
<!--    第六行:喜歡的型別 多選框-->
    <tr>
        <td>喜歡的型別:</td>
        <td><input type="checkbox" name="love"> 可愛的 <input type="checkbox" name="love"> 妖嬈的 <input type="checkbox" name="love"> 放蕩的 <input type="checkbox" name="love"> 都喜歡 </td>
    </tr>
<!--    第七行:自我介紹 textare框-->
    <tr>
        <td>自我介紹:</td>
        <td><textare>自我介紹</textare></td>
    </tr>
<!--    免費注冊的submit標簽-->
    <tr>
        <td></td>
        <td><input type="submit" value="https://www.cnblogs.com/qiuluoyuweiliang/p/免費注冊"></td>
    </tr>
<!--    同意注冊條款-->
    <tr>
        <td></td>
        <td><input type="checkbox">我同意注冊條款并遵守</td>
    </tr>
<!--    我是會員,跳轉頁面立即登錄-->
    <tr>
        <td></td>
        <td><a href="https://www.cnblogs.com/qiuluoyuweiliang/p/#">我是會員,立即登錄</a></td>
    </tr>
<!--    承諾條款:采用標題和無序串列完成-->
    <tr>
        <td></td>
        <td>
            <h2>我承諾</h2>
            <ul>
                <li>年滿18,單身</li>
                <li>抱著嚴肅的態度</li>
                <li>真誠尋找另一半</li>
            </ul>
        </td>
    </tr>
</table>
</body>
</html>

結束語

好的,關于HTML的介紹就到這里了,恭喜你邁進了前端的第一步!

轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/498856.html

標籤:Html/Css

上一篇:Matery主題自定義(一)黑夜模式

下一篇:vscode的安裝、切換為中文簡體、集成sass

標籤雲
其他(157675) Python(38076) JavaScript(25376) Java(17977) C(15215) 區塊鏈(8255) C#(7972) AI(7469) 爪哇(7425) MySQL(7132) html(6777) 基礎類(6313) sql(6102) 熊猫(6058) PHP(5869) 数组(5741) R(5409) Linux(5327) 反应(5209) 腳本語言(PerlPython)(5129) 非技術區(4971) Android(4554) 数据框(4311) css(4259) 节点.js(4032) C語言(3288) json(3245) 列表(3129) 扑(3119) C++語言(3117) 安卓(2998) 打字稿(2995) VBA(2789) Java相關(2746) 疑難問題(2699) 细绳(2522) 單片機工控(2479) iOS(2429) ASP.NET(2402) MongoDB(2323) 麻木的(2285) 正则表达式(2254) 字典(2211) 循环(2198) 迅速(2185) 擅长(2169) 镖(2155) 功能(1967) .NET技术(1958) Web開發(1951) python-3.x(1918) HtmlCss(1915) 弹簧靴(1913) C++(1909) xml(1889) PostgreSQL(1872) .NETCore(1853) 谷歌表格(1846) Unity3D(1843) for循环(1842)

熱門瀏覽
  • IEEE1588PTP在數字化變電站時鐘同步方面的應用

    IEEE1588ptp在數字化變電站時鐘同步方面的應用 京準電子科技官微——ahjzsz 一、電力系統時間同步基本概況 隨著對IEC 61850標準研究的不斷深入,國內外學者提出基于IEC61850通信標準體系建設數字化變電站的發展思路。數字化變電站與常規變電站的顯著區別在于程序層傳統的電流/電壓互 ......

    uj5u.com 2020-09-10 03:51:52 more
  • HTTP request smuggling CL.TE

    CL.TE 簡介 前端通過Content-Length處理請求,通過反向代理或者負載均衡將請求轉發到后端,后端Transfer-Encoding優先級較高,以TE處理請求造成安全問題。 檢測 發送如下資料包 POST / HTTP/1.1 Host: ac391f7e1e9af821806e890 ......

    uj5u.com 2020-09-10 03:52:11 more
  • 網路滲透資料大全單——漏洞庫篇

    網路滲透資料大全單——漏洞庫篇漏洞庫 NVD ——美國國家漏洞庫 →http://nvd.nist.gov/。 CERT ——美國國家應急回應中心 →https://www.us-cert.gov/ OSVDB ——開源漏洞庫 →http://osvdb.org Bugtraq ——賽門鐵克 →ht ......

    uj5u.com 2020-09-10 03:52:15 more
  • 京準講述NTP時鐘服務器應用及原理

    京準講述NTP時鐘服務器應用及原理京準講述NTP時鐘服務器應用及原理 安徽京準電子科技官微——ahjzsz 北斗授時原理 授時是指接識訓通過某種方式獲得本地時間與北斗標準時間的鐘差,然后調整本地時鐘使時差控制在一定的精度范圍內。 衛星導航系統通常由三部分組成:導航授時衛星、地面檢測校正維護系統和用戶 ......

    uj5u.com 2020-09-10 03:52:25 more
  • 利用北斗衛星系統設計NTP網路時間服務器

    利用北斗衛星系統設計NTP網路時間服務器 利用北斗衛星系統設計NTP網路時間服務器 安徽京準電子科技官微——ahjzsz 概述 NTP網路時間服務器是一款支持NTP和SNTP網路時間同步協議,高精度、大容量、高品質的高科技時鐘產品。 NTP網路時間服務器設備采用冗余架構設計,高精度時鐘直接來源于北斗 ......

    uj5u.com 2020-09-10 03:52:35 more
  • 詳細解讀電力系統各種對時方式

    詳細解讀電力系統各種對時方式 詳細解讀電力系統各種對時方式 安徽京準電子科技官微——ahjzsz,更多資料請添加VX 衛星同步時鐘是我京準公司開發研制的應用衛星授時時技術的標準時間顯示和發送的裝置,該裝置以M國全球定位系統(GLOBAL POSITIONING SYSTEM,縮寫為GPS)或者我國北 ......

    uj5u.com 2020-09-10 03:52:45 more
  • 如何保證外包團隊接入企業內網安全

    不管企業規模的大小,只要企業想省錢,那么企業的某些服務就一定會采用外包的形式,然而看似美好又經濟的策略,其實也有不好的一面。下面我通過安全的角度來聊聊使用外包團的安全隱患問題。 先看看什么服務會使用外包的,最常見的就是話務/客服這種需要大量重復性、無技術性的服務,或者是一些銷售外包、特殊的職能外包等 ......

    uj5u.com 2020-09-10 03:52:57 more
  • PHP漏洞之【整型數字型SQL注入】

    0x01 什么是SQL注入 SQL是一種注入攻擊,通過前端帶入后端資料庫進行惡意的SQL陳述句查詢。 0x02 SQL整型注入原理 SQL注入一般發生在動態網站URL地址里,當然也會發生在其它地發,如登錄框等等也會存在注入,只要是和資料庫打交道的地方都有可能存在。 如這里http://192.168. ......

    uj5u.com 2020-09-10 03:55:40 more
  • [GXYCTF2019]禁止套娃

    git泄露獲取原始碼 使用GET傳參,引數為exp 經過三層過濾執行 第一層過濾偽協議,第二層過濾帶引數的函式,第三層過濾一些函式 preg_replace('/[a-z,_]+\((?R)?\)/', NULL, $_GET['exp'] (?R)參考當前正則運算式,相當于匹配函式里的引數 因此傳遞 ......

    uj5u.com 2020-09-10 03:56:07 more
  • 等保2.0實施流程

    流程 結論 ......

    uj5u.com 2020-09-10 03:56:16 more
最新发布
  • 使用Django Rest framework搭建Blog

    在前面的Blog例子中我們使用的是GraphQL, 雖然GraphQL的使用處于上升趨勢,但是Rest API還是使用的更廣泛一些. 所以還是決定回到傳統的rest api framework上來, Django rest framework的官網上給了一個很好用的QuickStart, 我參考Qu ......

    uj5u.com 2023-04-20 08:17:54 more
  • 記錄-new Date() 我忍你很久了!

    這里給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 大家平時在開發的時候有沒被new Date()折磨過?就是它的諸多怪異的設定讓你每每用的時候,都可能不小心踩坑。造成程式意外出錯,卻一下子找不到問題出處,那叫一個煩透了…… 下面,我就列舉它的“四宗罪”及應用思考 可惡的四宗罪 1. Sa ......

    uj5u.com 2023-04-20 08:17:47 more
  • 使用Vue.js實作文字跑馬燈效果

    實作文字跑馬燈效果,首先用到 substring()截取 和 setInterval計時器 clearInterval()清除計時器 效果如下: 實作代碼如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta ......

    uj5u.com 2023-04-20 08:12:31 more
  • JavaScript 運算子

    JavaScript 運算子/運算子 在 JavaScript 中,有一些運算子可以使代碼更簡潔、易讀和高效。以下是一些常見的運算子: 1、可選鏈運算子(optional chaining operator) ?.是可選鏈運算子(optional chaining operator)。?. 可選鏈操 ......

    uj5u.com 2023-04-20 08:02:25 more
  • CSS—相對單位rem

    一、概述 rem是一個相對長度單位,它的單位長度取決于根標簽html的字體尺寸。rem即root em的意思,中文翻譯為根em。瀏覽器的文本尺寸一般默認為16px,即默認情況下: 1rem = 16px rem布局原理:根據CSS媒體查詢功能,更改根標簽的字體尺寸,實作rem單位隨螢屏尺寸的變化,如 ......

    uj5u.com 2023-04-20 08:02:21 more
  • 我的第一個NPM包:panghu-planebattle-esm(胖虎飛機大戰)使用說明

    好家伙,我的包終于開發完啦 歡迎使用胖虎的飛機大戰包!! 為你的主頁添加色彩 這是一個有趣的網頁小游戲包,使用canvas和js開發 使用ES6模塊化開發 效果圖如下: (覺得圖片太sb的可以自己改) 代碼已開源!! Git: https://gitee.com/tang-and-han-dynas ......

    uj5u.com 2023-04-20 08:01:50 more
  • 如何在 vue3 中使用 jsx/tsx?

    我們都知道,通常情況下我們使用 vue 大多都是用的 SFC(Signle File Component)單檔案組件模式,即一個組件就是一個檔案,但其實 Vue 也是支持使用 JSX 來撰寫組件的。這里不討論 SFC 和 JSX 的好壞,這個仁者見仁智者見智。本篇文章旨在帶領大家快速了解和使用 Vu ......

    uj5u.com 2023-04-20 08:01:37 more
  • 【Vue2.x原始碼系列06】計算屬性computed原理

    本章目標:計算屬性是如何實作的?計算屬性快取原理以及洋蔥模型的應用?在初始化Vue實體時,我們會給每個計算屬性都創建一個對應watcher,我們稱之為計算屬性watcher ......

    uj5u.com 2023-04-20 08:01:31 more
  • http1.1與http2.0

    一、http是什么 通俗來講,http就是計算機通過網路進行通信的規則,是一個基于請求與回應,無狀態的,應用層協議。常用于TCP/IP協議傳輸資料。目前任何終端之間任何一種通信方式都必須按Http協議進行,否則無法連接。tcp(三次握手,四次揮手)。 請求與回應:客戶端請求、服務端回應資料。 無狀態 ......

    uj5u.com 2023-04-20 08:01:10 more
  • http1.1與http2.0

    一、http是什么 通俗來講,http就是計算機通過網路進行通信的規則,是一個基于請求與回應,無狀態的,應用層協議。常用于TCP/IP協議傳輸資料。目前任何終端之間任何一種通信方式都必須按Http協議進行,否則無法連接。tcp(三次握手,四次揮手)。 請求與回應:客戶端請求、服務端回應資料。 無狀態 ......

    uj5u.com 2023-04-20 08:00:32 more