日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔！

生活随笔

當前位置： 首頁 > 前端技术 > javascript >内容正文

javascript

HTML+CSS+JavaScript复习笔记持更（一）——标签篇

發(fā)布時間：2025/3/12 javascript 23 豆豆
生活随笔 收集整理的這篇文章主要介紹了 HTML+CSS+JavaScript复习笔记持更（一）——标签篇 小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.

前言

博主現(xiàn)在還是在校生，目前大三，突然想起HTML的很多基礎(chǔ)都忘記的差不多了，于是買了幾本基礎(chǔ)書，創(chuàng)建這篇博文用于記錄復(fù)習筆記，也希望我自己在整理的時候，能幫助大家加深一些基礎(chǔ)知識的印象，本篇博文將會持續(xù)更新，如有遺漏不當之處，望大佬們指出，在此謝過。

HTML 概述

如果你看到了這篇博文，證明你至少是有html基礎(chǔ)的 ，對于基礎(chǔ)我就不做過多概述，簡單的來說，HTML就是一個因特網(wǎng)上的編寫網(wǎng)頁的語言基礎(chǔ)結(jié)構(gòu)如下：

<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Document</title><style></style> </head> <body></body> </html>
  • html語言中有區(qū)分單標簽和雙標簽，如：mate是單標簽，title是雙標簽
  • html標簽標示文件的開始，這之前不能編寫任何內(nèi)容
  • head是頭部標簽，這里面的放的是網(wǎng)頁文件信息，如：標題、編碼格式、URL等
  • meta是元信息標簽，用戶不可見，用于定義網(wǎng)頁信息的名稱、關(guān)鍵字等，它有兩個屬性，name和http-equiv，name用于描述網(wǎng)頁，方便搜索引擎檢索，后期優(yōu)化seo會用到
  • title標簽用于網(wǎng)頁標題，style用于風格樣式，這兩個通常都寫到head標簽中
  • body標簽是網(wǎng)頁的主體部分

注釋信息：

  • HTML中注釋的方法是<!--注釋的文字-->
  • CSS中注釋方法是/*注釋的文字*/
  • JavaScript中注釋是//注釋的文字或者/*注釋的內(nèi)容*/（前者單行注釋，后者可多行注釋）

HTML 標簽

html文件的主體部分通常就是由各種標簽組成，常用的標簽舉例：
a、h、div、p、span、img、br、link、table、tbody、tr、td、th、caption、sub、sup、input、button、audio、video

  • a標簽用于超鏈接，使用語法<a href="www.baidu.com" target="_blank" >這里是內(nèi)容</a>
    href中是需要跳轉(zhuǎn)到的地址（填#，可以不跳轉(zhuǎn)）
    target是跳轉(zhuǎn)方式（常用的兩種屬性_blank在新標簽中打開、_self在本標簽頁面打開）
    內(nèi)容可以是文字，可以是img圖片

  • h標簽用于標題，共6級，權(quán)重逐級遞減，大小也逐級遞減。由于部分瀏覽器將h1過大的展示，所以建議使用h2代替h1，也不建議寫多個h1

<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Document</title><style></style> </head> <body><a href=""></a><h1>這是h1標簽</h1><h2>這是h2標簽</h2> </body> </html>

實例：

  • div標簽就是一個塊級元素，可以包含大部分標簽，在編寫網(wǎng)頁時，可以將網(wǎng)頁按照實際需求進行分塊，通過div封裝不同模塊，可以理解為一個盒子，配合class、id。可以對div進行樣式，動畫操作。
  • p標簽被稱為段落標簽，用于包含段落，使用p標簽將會新起一個段落，多個p標簽之間會有行距
  • br標簽是換行標簽，如果不需要行距，但是需要換行的話，可以使用<br>，
    br在html中規(guī)范寫法是<br>
    在xhtml中規(guī)范寫法是<br />
    平時使用這兩種都是兼容的，除非聲明了文檔格式為xhtml，必須使用<br />，否則用哪個都可以，實例：
<div><p>這個就是一個段落</p><p>和上面一句話會有行距</p>你可以在這一句話<br />里面選擇換行</div>

實例：

  • span標簽被用來組合文檔中的行內(nèi)元素，與div類似的是，他們都是用來組合元素的，但是div是塊級元素，span是行內(nèi)元素，塊級和行內(nèi)的具體區(qū)別以后會說，組合后不會產(chǎn)生任何影響，除非使用class或者id對它的進行了操作
  • img用于在頁面上添加圖片，在里面還可以添加width、height等屬性，如果需要保持圖片原來的縱橫比，可以只添加寬高其中一個屬性，另一個會自動計算適配。
    src是圖片路徑地址，可以是相對路徑，可以是絕對路徑
    alt是錯誤提示信息，也就是如果圖片加載不出來，會顯示在頁面上的提示信息
<img src="./img/4.png" alt="">
  • link標簽是鏈接標簽，用于引入一個css樣式文件，它必須寫在head標簽內(nèi)，且可以重復(fù)出現(xiàn)<link rel="stylesheet" href="這里填css文件的地址">
  • table標簽是表格標簽，使用一個table就會在頁面中創(chuàng)建一個表格
  • tbody標簽是表格標簽下的一個標簽，與body類似，用于包含表格的主體內(nèi)容，這個標簽，我覺得可有可無
  • tr標簽表示一行
  • td標簽表示一個單元格（也被稱作列）
  • th標簽是類似于h標簽，會加粗顯示，常用于表格中的標題
<table><caption>這是表頭標題，只能有一個</caption><th>這是加粗顯示的，可用于標題等</th><tr><td><td></tr> </table>

在td標簽中，經(jīng)常會出現(xiàn)需要跨行和跨列顯示的單元格，這時采用下面的方法
跨行：<td rowspan="2">=</td> 如果需要跨多行，可以改數(shù)字
跨列：<td colspan="2">0</td> 跨多列同理

  • sup標簽用于上標123456<sup>這是上標</sup>
  • sub標簽用于下標123456<sub>這是下標</sub>
    實例：
  • input標簽用于收集用戶信息，通過改變type的值，可以達到不同的要求，通常用語表單元素
<body><form><input type="text" name="text"><input type="button" name="anniu" value="這是按鈕"><input type="checkbox" name="fuxuan">復(fù)選框1<input type="checkbox" name="fuxuan">復(fù)選框2<input type="password" name="pass"><input type="file"><br><input type="hidden"><input type="image" src="" alt="這是圖"><input type="radio" name="danxuan">單選按鈕<input type="reset" value="重置內(nèi)容"><input type="submit" value="提交表單"></form> </body>

  • audio 音頻標簽、 video 視頻標簽，這兩個都是html5新增的語義化標簽，用法與img標簽類似，在src中添加文件地址即可
<audio src=""></audio><video src=""></video>

總結(jié)

以上是生活随笔為你收集整理的HTML+CSS+JavaScript复习笔记持更（一）——标签篇的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。