ACCP8.0 HTML標簽

来源:https://www.cnblogs.com/zuozhaoquan/archive/2019/01/25/10317862.html
-Advertisement-
Play Games

ACCP8.0 HTML標簽 第一章1、HTML超文本標記語言2、網頁<html></html>3、網頁頭部<head></head>4、網頁標題<title></title>5、網頁主體<body></body>6、DOCTYPE聲明3種級別：（1）Strict 嚴格類型（2）Transition ...


ACCP8.0 HTML標簽

第一章
1、HTML超文本標記語言
2、網頁<html></html>
3、網頁頭部<head></head>
4、網頁標題<title></title>
5、網頁主體<body></body>
6、DOCTYPE聲明3種級別：
（1）Strict 嚴格類型
（2）Transitional過渡類型
（3）Frameset框架類型
7、網頁摘要<meta>標簽
8、字元編碼：
gb2312簡體中文
ISO-885901純英文
big5繁體
UTF-8國際通用編碼
9、W3C 萬維網聯盟




10、標題標簽
<h1>一級標題</h1>
<h2>二級標題</h2>
<h3>三級標題</h3>
<h4>四級標題</h4>
<h5>五級標題</h5>
<h6>六級標題</h6>
11、段落<p></p>
12、換行<br/>
13、水平線<hr/>
14、字體加粗<strong></strong>
15、斜體字<em></em>
16、註釋<！--註釋內容-->
17、特殊符號
空格： 大於號：>
小於號：< 引號："
版權符號：©

18、圖像標簽
<img src=“圖片地址”alt=“圖像的替代文字”title=“滑鼠懸停提示文字”width=“圖片寬度”height=“圖片高度”/>

19、鏈接標簽
<a href=“鏈接地址”target=“目標視窗位置”>鏈接文本或圖像</a>
Target常用取值：_self（自身視窗）和_blank（新建視窗）

20、錨鏈接
<a name=“market”>目標位置乙</a>
<a href=“#market”>當前位置甲</a>

21、功能性鏈接
<a href=“mailto:電子郵箱地址”>聯繫我們</a>












第二章
22、無序列表 Type屬性取值：disc實體圓心 square 實體方心 circle空心圓
<ul type=“”>
<li>列表項</li>
</ul>
23、有序列表 Type屬性取值：1數字 A/a大/小寫字母 I/i大/小寫羅馬數字
<ol type=“”>
<li>列表項</li>
</ol>
24、定義列表
<dl>
<dt>標題</dt>
<dd>內容</dd>
</dl>
25、表格
<table border=“ ”>
<tr>
<th>標題</th>
</tr>
<tr>
<td>內容</td>
</tr>
</table>
26、 表格跨列屬性colspan 表格跨行屬性rowspan
27、視頻元素：controls手動控制播放 autoplay自動播放 loop迴圈播放
1、<video src=“視頻路徑” controls=“controls”></video>
2、<video controls><source src=“視頻路徑”></video>
28、音頻元素：
1、<audio src=“視頻路徑” controls=“controls”></audio>
2、<audio controls><source src=“音頻路徑”></audio>
29、HTML5結構元素
<header></header>標題頭部區域的內容（用於頁面或頁面中的一塊區域）
<footer></footer>標記腳部區域的內容（用於整個頁面或頁面的一塊區域）
<section></section>Web頁面中的一塊獨立區域
<article></article>獨立的文章內容
<aside></aside>相關內容或應用（常用於側邊欄）
<nav></nav>導航類輔助內容
30、iframe內聯框架
<iframe src=“引用頁面地址”name=”框架標識名”… ></iframe>


第三章
31、表單
<form method=“提交方式get/post” action=“提交頁面”>
32、表單元素：
文本框：
<input type=“text” name= “元素名稱”value=“初始值”size=“初始寬度”>
密碼框：
<input type=“password” name= “元素名稱”value= “初始值” maxlength= “最大字元數”>
單選按鈕：<input type= “radio” name= “元素名稱”value= “值” >
覆選框：<input type= “checkbox” name= “元素名稱” value= “值” checked= “checked”>
列表框：<select>
<option value= “值” selected= “selected”>顯示文本</option>
<option value= “值”>顯示文本</option>
</select>
提交按鈕：<input type= “submit” name= “元素名稱” value= “顯示文字”>
重置按鈕：<input type= “reset” name= “元素名稱” value= “顯示文字”>
普通按鈕：<input type= “button” name= “元素名稱” value= “顯示文字”>
圖片按鈕：<input type= “image” name= “元素名稱” src= “圖片地址” >
多行文本域：
<textarea name= “元素名稱” cols= “顯示列寬” rows= “顯示行數”>內容</textarea>
文件域：
<form action=“” method= “” enctype=”multipart/form-data”>
<input type= “file” name=“元素名稱” >
</form>
郵箱：<input type= “email” name=“元素名稱” >
網址：<input type= “url” name=“元素名稱” >
數字：<input type= “number” name=“元素名稱”min=“ ”max=“ ”step=“ ” >
滑塊：<input type= “range” name=“元素名稱”min=“ ”max=“ ”step=“ ” >
搜索框：<input type= “search” name=“元素名稱” >
隱藏域：<input type=“hidden” name=“元素名稱” value=“值”>
33、表單隻讀屬性：readonly=“readonly”
34、表單禁用屬性：disabled=“disabled”
35、域：<fieldset></fieldset>
域標題：<legend></legend>
36、表單元素標註：<label for= “元素id名稱”>文本</label>
37、表單初級驗證方法：placeholder（文本框提示） required(文本框填寫內容不為空)
Pattern（文本框輸入的內容是否與自定義的正則表達式相匹配）


第四章
38、定義樣式信息
<style type=”text/css”></style>
39、鏈接外部樣式表
<link href=“樣式文件路徑” rel=“stylesheet” type=“text/css”>
40、導入外部樣式表
<style type=”text/css”>
@import url(“樣式文件路徑”)
</style>
41、樣式優先順序
行內樣式>內部樣式表>外部樣式表
ID選擇器>類選擇器>標簽選擇器
42、高級選擇器
（1）層次選擇器（2）結構偽類選擇器（3）屬性選擇器
第五章
43、<span>標簽
44、字體樣式
font-family:字體類型
font-size:字體大小
font-style:字體風格
font-weight:字體粗細
font:設置所有字體屬性
45、文本屬性
color:文本顏色
text-align:水平對齊方式 left左邊 right右邊 center居中 justify兩端對齊
text-indent:首行縮進
line-height:文本行高
text-decoration:文本裝飾 none無 underline下劃線 overline上劃線 line-through刪除線
blink 文本閃爍
vertical-align:垂直對齊方式
文本陰影：text-shadow:color x軸位移 y軸位移 模糊半徑；
46、超鏈接偽類
a:link 單擊訪問前
a:visited 單擊訪問後
a:hover 滑鼠懸浮上
a:active 滑鼠單擊未釋放
47、網頁佈局<div></div>標簽
48、背景屬性
background-color:背景顏色
background-image:背景圖像
background-repeat: repeat水平，垂直兩方向平鋪
background-repeat: no-repeat不平鋪
background-repeat: repeat-x水平方向平鋪
background-repeat: repeat-y垂直方向平鋪
background-position背景定位
background-size背景尺寸
49、列表樣式
列表項符號list-style-type:none無 disc實心圓 circle空心圓 square實心正方形 decimal數字
列表項圖片list-style-image:url(圖片路徑);
放置列表項list-style-position:inside放置文本以內 outside文本左側，文本以外
50、CSS3漸變
linear-gradient(漸變方向，顏色1，顏色2, …)
第六章
51、border邊框
border-top-color:上邊框顏色
border-right-color:右邊框顏色
border-bottom-color:下邊框顏色
border-left-color:左邊框顏色
border-color:邊框顏色
border-top-width:上邊框粗細
border-right-width:右邊框粗細
border-bottom-width:下邊框粗細
border-left-width:左邊框粗細
border-width:邊框粗細
border-top-style:上邊框樣式
border-right-style:右邊框樣式
border-bottom-style:下邊框樣式
border-left-style:左邊框樣式
border-style:邊框樣式
border:邊框粗細 邊框顏色 樣式
52、margin外邊距
margin-top 上外邊距
margin-right 右外邊距
margin-bottom 下外邊距
margin-left左外邊距
margin 邊距
53、padding內邊距
padding-top 上內邊距
padding-right 右內邊距
padding-bottom 下內邊距
padding-left左內邊距
padding 內邊距
54、盒子模型總尺寸=邊框寬度+內邊距+外邊距+內容寬度
55、box-sizing盒子模型佈局
content-box:預設值
border-box:盒子的寬度或高度等於元素內容的寬度與高度
inherit:此值使元素繼承父元素的盒子模型模式
56、圓角邊框：border-radius
57、圓形：border-radius：50% （可製作半圓形、扇形）
58、盒子陰影：box-shadow:inset x軸位移 y軸位移 模糊半徑 顏色；



第七章
59、display屬性
display:block 塊級元素預設值
display:inline 內聯元素預設值
display:none 元素不顯示

60、float浮動
float:left元素向左浮動
float:right元素向右浮動
float:none元素不浮動，預設值
61、clear清除浮動
clear:left 在左側不允許浮動元素
clear:right 在右側不允許浮動元素
clear:both 在左、右兩側不允許浮動元素
clear:none 預設值，允許浮動元素出現在兩側
62、overflow溢出處理
overflow:visible 預設值，多的內容出現在盒子之外
overflow:hidden 多的內容不可見
overflow:scroll 內容會被修剪，瀏覽器會出現滾動條
overflow:auto 如果內容被修剪，出現滾動條

第八章
63、position定位
position:static 預設值，沒有定位
position:relative 相對定位，以標準流的排版方式為基礎，然後使盒子在他原位置進行偏移，相對定位的盒子仍在標準流中
position:absolute 絕對定位，以父元素為基準進行定位，絕對定位會脫離標準流
position:fixed 固定定位，是以瀏覽器視窗為基準進行定位，當瀏覽器拖動時他位置依然保持不變

64、z-index 層疊
z-index屬性用於調整元素定位時重疊上下的位置

65、透明設置
opacity:x (x值為0-1，值越小越透明) 如：opacity:0.4;
filter:alpha(opacity=x) (x值為0-100，值越小越透明) 如：filter:alpha(opacity=40);

第九章
66、變形函數
transform:[transform-function]*;
常用的transform-function：
translate():平移函數 scale():縮放函數 rotate():旋轉函數 skew():傾斜函數
CSS3 3D變形函數：translate3d():平移函數 scale3d():縮放函數 rotate3d():旋轉函數
2D變形
2D位移：translate（x軸，y軸） 2D縮放：scale（x軸，y軸）
2D傾斜：skew（x軸，y軸） 2D旋轉：rotate（x軸，y軸）
67、過渡屬性
transition:[transition-property transition-duration transition-timing-function
transition-delay]*
transition主要包括以下四個屬性值：
transition-property：指定過渡或動態模擬的CSS屬性
transition-duration：指定完成過渡所需要的時間
transition-timing-function：指定過渡函數
transition-delay：指定過渡開始出現的延遲時間


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • windows安裝mongodb服務簡潔版教程
    根據網上安裝教程，簡單總結如下： 1.去mongodb官網下載電腦系統對應版本的軟體，比如我的是windows 64位的，就選擇64位的，可能下載下來之後文件夾上面顯示的是win32，這個不用理會； 2.把該目錄放到自己對應放軟體的盤下，我放在了d盤； 3.在mongodb文件夾目錄下新建data文 ...
  • 資料庫事務的基本概念
    事務的基本特性： 事務有4個非常重要的特性 （ACID) Atomicity（原子性） 事務是一個不可分割的整體，所有操作要麼全做，要麼全不做；只要事務中有一個操作出錯，回滾到事務開始前的狀態的話，那麼之前已經執行的所有操作都是無效的，都應該回滾到開始前的狀態。 Consistency（一致性） 事 ...
  • redis數據操作
    數據結構 redis是key-value的數據結構，每條數據都是一條字元串。註意：鍵的類型是字元串，並且不能重覆。 值的類型分5種： 字元串string 哈希hash 列表list 集合set 有序集合 數據操作行為 保存 修改 獲取 刪除 sting類型 字元串類型的redis中最為基礎的數據存儲 ...
  • Android launcher 壁紙 wallpaper
    壁紙分為動態和靜態兩種： 如果只需要修改預設靜態壁紙,替換frameworks/base/core/res/res/drawable/default_wallpaper.jpg即可,或者在源碼中修改對應default_wallpaper地址.修改動態壁紙：在frameworks/base/core/ ...
  • iOS10--消息通知的基本使用
    官方將通知單獨放在了UserNotifications.framework，使用時需要導入框架。UserNotifications.framework主要類文件： UNUserNotificationCenter的應用： 請求用戶授權： UNUserNotificationCenter* cente ...
  • Android AutoCompleteTextView和MultiAutocompleteTextView實現動態自動匹配輸入的內容
    AutoCompleteTextView MultiAutocompleteTextView 這兩個控制項長的很相似,功能也很相似。 AutoCompleteTextView 功能: 動態匹配輸入的內容,如百度搜索引擎當輸入文本時 可以根據內容顯示匹配的熱門信息。 獨特屬性 android:compl ...
  • Android 使用TextView實現跑馬燈效果
    前言 我們在開發中經常會遇到一個小問題。比如下麵一個小例子： 這個文字太長，單行中導致無法全部顯示出來，這就是今天要實現的功能。 當然，百度中也有很多這種解決方案。 其中有一種，例如： android:ellipsize="marquee" android:focusable="true" andr ...
  • 【代碼筆記】Web-CSS-CSS盒子模型
    一，效果圖。 二，代碼。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>CSS 盒子模型</title> <style> div.ex { width: 220px; padding: 10px; border: 5px so ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發（一）：使用.NET MAUI開發第一個安卓APP
    移動開發（一）：使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說，近來想嘗試開發一款安卓APP，考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP，畢竟是使用Visual Studio開發工具，使用起來也比較的順手，結合微軟官方的教程進行了安卓 ...
  • wpf ToggleButton選中效果和一個登錄界面
    前言 QuestPDF 是一個開源 .NET 庫，用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫，它徹底改變了我們生成 PDF 文檔的方 ...
  • 彈幕樹洞項目功能新增篇
    項目地址 項目後端地址： https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址： ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址： http://tree ...
  • 第27篇 sqlserver2022詳細安裝步驟
    話不多說，直接開乾 一.下載 1.官方鏈接下載： https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe，運行開始下載SQL server； 二. ...
  • .NET 開源高性能 MQTT 類庫
    前言 隨著物聯網（IoT）技術的迅猛發展，MQTT（消息隊列遙測傳輸）協議憑藉其輕量級和高效性，已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫，為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog文檔翻譯系列（六） - 可用的接收器、增強器、格式化輸出
    Serilog支持多種接收器用於日誌存儲，增強器用於添加屬性，LogContext管理動態屬性，支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項，適用於不同需求。 ...
  • 警惕 Visual Studio 屬性求值副作用導致邏輯不符合預期
    目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據，爬取信息時需要模擬瀏覽器行為，否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下： 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • [使用目前最新版]HybridCLR6.9.0+YooAsset2.2.4實現純C# Unity熱更新方案 (一)
    1.前言 什麼是熱更新 游戲或者軟體更新時，無需重新下載客戶端進行安裝，而是在應用程式啟動的情況下，在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR，Xlua，ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles，Addressable， ...
  • 在 ASP.NET Core Web API 中使用操作篩選器統一處理通用操作
    本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺，其實像阿裡雲，騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後，它會送 ...
  • 第28篇 如何.net中實現高效可靠數據同步api
    通過以下方式可以高效，並保證數據同步的可靠性 1.API設計 使用RESTful設計，確保API端點明確，並使用適當的HTTP方法（如POST用於創建，PUT用於更新）。 設計清晰的請求和響應模型，以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類