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

HTML

前端HTML5CSS3基础知识点

發布時間：2024/1/23 HTML 21 豆豆

生活随笔收集整理的這篇文章主要介紹了前端HTML5CSS3基础知识点小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

HTML語言

ctrl+B 將文字加粗

ctrl+1 /2 /3 標題

ctrl+shift + i 插入圖片

不是編程語言編程語言都會有自己的語法結構 html語言不是編程語言它是標記語言

一組標簽 --》特定功能—》瀏覽器里的渲染引擎

html hyper 超 Text 文本 markup 標記 language語言文本 .txt 文字字符超文本不僅僅只有文字圖片視頻音頻鏈接形式：閉合標簽（雙標簽）<>開始標簽 </>結束標簽<標簽關鍵字></標簽關鍵字> <html></html> 根標簽 <head></head> 頭部標簽對瀏覽器說話非閉合標簽（單標簽）<meta charset="UTF-8"> chartset = "UTF-8" 屬性名 = ”屬性值“

瀏覽器默認字體字體大小 16px

編碼

ASCII 字母+西文+符號 <128 8位二進制 256個數據第一位0 后7位 128個數據

ASCII擴展 8第一位用了 256

GBK(6000個漢字) GB2312（10000漢字） GB18030 （繁體字） 0-127 ASCII +擴充

Unicode 萬國碼全球所有字符（1：01110111 這是一個漢字還是字母）

UTF-8（解決問題） UTF-16

常用文本標簽

1:加粗字體的標簽: 有效內容 加粗 唯一差別：strong 語義化（權重） 2：斜體標簽 斜體 斜體（語義化） 3：刪除標簽（中劃線） <del>語義的</del> <s></s> 4：下劃線 underline 5:水平線 <hr> <hr color="red" width="300px" align="left"> color 顏色 width 寬度 align 對齊方式 left 左 right右 center 中心居中對齊

無形當中最有形（90%）

span 小容器圖標文字 div 大盒子大容器大圖大的內容沒有默認屬性默認樣式

常用

1:段落標簽(大段文字) paragraph 特點：上下外間距（16px） 2：標題標簽 hi h1--h6 h1在當前界面只有一個 h1會包裹logo 權重大 3：插入圖片的標簽 (本質是文字) <img src="地址" alt="圖片找不到文字的提示" ># 解決圖片下間隙問題： 1：改變對齊方式 ---》vertical-align:middle（中線）top bottom baseline(只要不是基線都可以解決)圖片路徑：絕對路徑：不建議 c://a/b/a.jpg 網上的圖片路徑https://m.360buyimg.com/babel/jfs/t1/14767/35/9502/98915/5c8074faE4aa55aa9/0f1a568b3e5bd8f6.jpg 相對路徑：本地路徑同級目錄圖片和當前文檔是一個文件下上一級跳出幾個文件夾一個../ 2個../../ 下一級

文本屬性（css 樣式語言）

設置標簽屬性： 1：開始標簽 < 屬性名=“屬性值”> 默認屬性自定義樣式屬性 style="屬性名:屬性值；屬性名:屬性值;屬性名：屬性值； "# style自定義樣式集合（1）字體屬性字體顏色 : color:red/yellow/green 字體家族: "宋體" "楷體" font-family: "微軟雅黑" 字體粗細： font-weight: 100-900 100最細 900最粗 400normal 正常字體形態：font-style: 斜體 italic / 正常 normal font: 形態粗細字體大小家族

ps

1:視圖–》標尺點中標尺鼠標右鍵設置單位為像素

2：左側工具欄標尺鼠標拽著拉動值在菜單欄

3：選區也可以測量

4：切圖 6個切片在你切的的圖片上畫輪廓

? 點擊文件 —》存儲為web格式選圖片后綴 (phg-8) --》命名–——》存儲（！！！切換成選中的切片）

在桌面有文件夾 images 里面有你切下來的圖片

5：吸管粘貼 #f5f5f5

總結

以上是生活随笔為你收集整理的前端HTML5CSS3基础知识点的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。