html 基本用法
屬性入門
**html 基本構架**
簡單標籤
複雜標籤
復合標籤
表單**
iframe 內嵌框架
frame 框架集視窗
html 5 多**標籤
顏色表示法
全寫:hypertextmark-uplanguage
概念: 一種為普通檔案中某些字句加上標示的語言,其目的在於運用標記(tag)使檔案達到預期的顯示效果。
主要用於網頁的製作
雙標籤 (圍堵標籤)
它以開始標籤及結束標籤將文字圍住,令其達到預期顯示效果
內容有加粗效果
單標籤
標籤單獨出現,只有開始標籤沒有結束標籤
不需要包含任何東西, 本身就具有某種含義
換行
hr 橫線
是一條 顏色為紅色 比較粗的一條橫線
貫穿螢幕的一條橫線
格式 《標籤名 屬性名="屬性值" 第二個屬性="">
頭宣告
根標籤身體, 主體網頁檔案
使用webstrom 有快捷方式 生成基本架構
html:5 加上 tab 鍵 可以自動生成 基本架構
html:4s
字型加粗
字型傾斜
下劃線刪除線
下標文字
上標文字
字型變大
字型變小
居中 標題標籤
~***
段落標籤 有換行功能 段落之間可以自動隔行
cctv
表示它所包含的文字是乙個更長的單詞或短語的縮寫形式
可以在 標籤中使用全域性的 title 屬性,這樣就能夠在滑鼠指標移動到 元素上時顯示出簡稱/縮寫的完整版本。
特殊符號
字元實體
空格 (分號)
大於號》
>(分號)
小於號<
<(分號)
引號(")
"(分號)
©(分號)
face 字型
整個網頁的主體部分, 主要的顯示區域
背景 background bgcolor
bgcolor="green"
background="名稱"
text="red"
文字中 沒有新增顏色的
// body 是其他子標籤的父元素, 類似於 父親的角色
如果兒子沒有女朋友, 聽父親給他介紹的
一旦兒子已經有了自己的女朋友, 父親給他介紹其他女朋友的時候, 兒子是不會屈服的
width/ height
title
alt 的替代文字
href 鏈結指向的位置
href 錨鏈結
// 頁面回到頂部功能
1- 設定乙個錨點
2- 回到錨點的鏈結, 將鏈結指向錨點
回到頂部
target 頁面開啟方式_blank 新頁面開啟
_self 自身頁面開啟
###一年四季 **
建立多個網頁檔案
有序列表
王者榮耀
火影忍者
陰陽師夢幻西遊
爐石傳說
type 專案符號的顯示方式 屬性的值 1 a a i i
start 起始編號
無序列表type=""
空心圓 circle
實心圓 disc
小方塊 square
無修飾 none
使用場景 新聞**
專案列表武俠人物
郭靖黃蓉
演藝圈趙麗穎
謝娜武俠人物
郭靖黃蓉
楊康楊過
it 行業
支音曹偉
繼斌演藝圈 趙麗穎
謝娜 場景 每個班 有多名學生
某公司, 多個專案組, 每個專案組又有多個組員
input 輸入框
input 屬性
含義text
文字password
密碼number
數字框email
郵箱date
日期框button
按鈕submit
提交按鈕
reset
重置按鈕
radio
單選鈕 需要配合name 屬性
checkbox
核取方塊file
檔案選擇框
hidden
隱藏域
非input 屬性
select / option
下拉列表 / 選項
button
按鈕textarea
大文字輸入框
屬性name 屬性的含義 給表單元素起名稱, 用於區分多個文字框
使用者名稱 : 真實姓名 : - 在單選鈕中 標識那些單選鈕屬於同一組的
value 屬性 (英語 值)
用於指定表單元素初始值
value 放在 button中 用於顯示 按鈕的顯示文字
size
指定表單元素的初始寬度
如果表單型別是 text 或者 password 表單元素大小以字元為單位
如果是其他型別 以畫素為單位
button點我一下
####拓展知識
預設選中
checked / selected
checked 預設選中
對單選鈕和核取方塊生效 預設選中當前選項
如果是 下拉列表 option 中 必須換成 selected
唯讀和禁用
readonly / disabled
使用者名稱;
你好
標註 label
男女
吃
喝
表單驗證
placeholder / required
placeholder 提示資訊 h5
使用者名稱;
使用者名稱
required
手機號 pattern 屬性適用於以下 型別:text, search, url, telephone, email 以及 password 。
對比列表
三行兩列的乙個**
####格式補充
標題 caption
表頭 tr>th
表結構thead **頁首
tbody 表主題
tfoot **頁尾
案例模擬課程表 6 行 9 列
使用工具快速生成
table>(tr>(td*9))*6
td中填寫內容
table>(tr>(td*9))*6
常用屬性
屬性名屬性含義
border
邊框 單位是畫素
bordercolor
邊框顏色
cellspacing
兩個單元格之間的距離,合併邊框 該屬性設定為0
cellpadding
單元格與其內容之間的距離
width / height
寬高align
設定在table 中 **位置, 設定在 tr 或td中 內容的排版
bgcolor / background
背景顏色和
colspan
合併列rowspan
合併行
課程表案例
6圖形案例
使用超連結 在窗體上切換
圖形
在內嵌框架上開啟超連結
src 指向磁碟上的檔案路徑
顏色有三種表示法
所有的顏色都是三原色組成 紅祿藍
根據每種顏色的比例不同, 顯示出不同的色彩,
把每種顏色濃淡 使用數字描述 0 - 255
知道16進製制 1-9 abcdef
(二進位制 11111111) 換算成為 16進製制 ff
rgb(255,0,0)
rgba(255,0,0,0.5)
0-1 之間表示的是顏色的透明度 前端筆記1 html
html html結構介紹 文件宣告,告訴瀏覽器使用html5的標準解析頁面 根標籤體標籤 給使用者看的內容寫在body裡面 常見的文字標籤 內容標題 h1 h6 獨佔一行,字型加粗,自帶上下間距 段落標籤 p 獨佔一行,自帶上下間距 換行 br 在html頁面中回車不能換行,只能識別乙個空格 水平...
前端單詞1 html 單詞
html 單詞 閱讀 基本標籤 音標釋義 hypertext ha p 超文字mark up m k p 置標 提價幅度 language l gw d 語言head hed 頭meta m t 元語言charset a r set 字符集body b d 身體 主體 storm st m 暴風雨 ...
隨筆1 HTML基礎
1.1 什麼是網頁 我們開啟瀏覽器訪問的一切,都由網頁構成,簡單的說,網頁就是html 1.2 html概念 1.2.1 超文字標記語言 htper text markup language 標準通用標記語言下的乙個應用。html 不是一種程式語言,而是一種標記語言 markup language ...