2017-11-29 HTML5樣式、鏈接和表格

来源:http://www.cnblogs.com/zsan/archive/2017/11/29/7922570.html
-Advertisement-
Play Games

HTML5樣式、鏈接和表格HTML5列表<ol> 有序列表<ul> 無序列表<li> 列表項 <dl> 列表<dt> 列表項<dd> 描述 1.無序列表 使用<ul>、<li> 屬性:disc、circle、square2.有序列表 使用<ol>、<li> 屬性:A、a、I、i、start3.嵌套列 ...


HTML5樣式、鏈接和表格
HTML5列表
<ol> 有序列表
<ul> 無序列表
<li> 列表項

<dl> 列表
<dt> 列表項
<dd> 描述
---------------
1.無序列表
使用<ul>、<li>
屬性:disc、circle、square
2.有序列表
使用<ol>、<li>
屬性:A、a、I、i、start
3.嵌套列表
使用<ul>、<ol>、<li>
4.自定義列表
使用<dl>、<dt>、<dd>

 1 <!doctype html>
 2 <html>
 3 <head>
 4     <meta charset = 'utf-8'>
 5     <title>HTML5樣式、鏈接和表格</title>
 6 </head>
 7 <body>
 8     <a href = 'http://www.baidu.com '>百度</a><br/>
 9     <ul><!-- 無序-->
10         <li>蘋果</li>
11         <li>雪梨</li>
12         <li>香蕉</li>
13     </ul>
14     <ul type = 'disc'><!-- 無序-->
15         <li>蘋果</li>
16         <li>雪梨</li>
17         <li>香蕉</li>
18     </ul>
19     <ul type = 'circle'><!-- 無序-->
20         <li>蘋果</li>
21         <li>雪梨</li>
22         <li>香蕉</li>
23     </ul>
24     <ul  type = 'square'><!-- 無序-->
25         <li>蘋果</li>
26         <li>雪梨</li>
27         <li>香蕉</li>
28     </ul>
29     <ol ><!-- 有序-->
30         <li>蘋果</li>
31         <li>雪梨</li>
32         <li>香蕉</li>
33     </ol>
34     <ol type = 'A'><!-- 有序-->
35         <li>蘋果</li>
36         <li>雪梨</li>
37         <li>香蕉</li>
38     </ol>
39     <ol type = 'a'><!-- 有序-->
40         <li>蘋果</li>
41         <li>雪梨</li>
42         <li>香蕉</li>
43     </ol>
44     <ol type = 'I'><!-- 有序-->
45         <li>蘋果</li>
46         <li>雪梨</li>
47         <li>香蕉</li>
48     </ol>
49     <ol type = 'i'><!-- 有序-->
50         <li>蘋果</li>
51         <li>雪梨</li>
52         <li>香蕉</li>
53     </ol>
54     <ol  start = '16'><!-- 有序-->
55         <li>蘋果</li>
56         <li>雪梨</li>
57         <li>香蕉</li>
58     </ol>
59     <ul><!-- 嵌套-->
60         <li>動物</li>
61         <ul>
62             <li>陸地動物</li>
63             <ul>
64                 <li></li>
65                 <li></li>
66                 <li></li>
67             </ul>
68             <li>水中動物</li>
69             <ul>
70                 <li>海洋動物</li>
71                 <ul>
72                     <li>鯊魚</li>
73                     <li>鯨魚</li>
74                 </ul>
75                 <li>淡水動物</li>
76                 <ul>
77                     <li>鯉魚</li>
78                     <li>鯽魚</li>
79                 </ul>
80             </ul>
81         </ul>
82         <li>植物</li>
83         <ol>
84             <li>松樹</li>
85             <li>蒲公英</li>
86             <li>仙人球</li>
87         </ol>
88     </ul>
89     
90 </body>
91 </body>
92 <html>

 


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

-Advertisement-
Play Games
更多相關文章
  • 1.介面返回的流: 2.下載流文件的代碼 方法一:是用了插件 https://github.com/kennethjiang/js-file-download 方法二:是用了 blob 不管哪種方法,記得設置 responseType ...
  • <div> <ul class="nav nav-tabs"> <li class="active"><a href="#Index" aria-controls="Index" role="tab" data-toggle="tab">首頁</a></li> <li ><a href="#Inde ...
  • express的安裝 express創建新項目 創建完畢後,修改express的預設視圖引擎。 在views下刪掉對應的jade文件 加入index.html 在index.html中輸入 ...
  • 1、導入資源 2、JSP代碼 3、Js代碼 註意: 4、controller代碼 5、工具類 ...
  • 前言 除了瀏覽器提供的原生事件外,有時我們還需要自定義事件以滿足特定的需求,比如小模塊之間的通信,傳遞信息等。JavaScript提供了幾種自定義事件的方式: 1. Event() 構造函數, 創建一個新的事件對象 Event 2. CustomEvent() 創建一個自定義事件 3. docume ...
  • HTML頁面跳轉: window.open(url, "", "width=600,height=400"); 第二個參數:_self,在當前視窗打開視窗;_blank(預設值),在另外的新建視窗打開新視窗; window.location.href="http://www.jb51.net"; / ...
  • 問題如下圖所示: 一般處理此類問題都會有一個屬性:”event.preventDefault()”,但是如果直接使用會導致頁面的內部滾動也失效導致不能滾動,我所處理的方式也與其類似。 因為滑動區域是向走的,所以滑動塊的頂部到瀏覽器頂部的距離最大為0(其餘為負值[$('#bodycthead').of ...
  • 1.JavaScript中的註釋方式有以下兩種 // This is an in-line comment. /* This is a multi-line comment */ 2.avaScript提供七種不同的data types(數據類型), undefined(未定義) null(空) b ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 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 ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...