2. 程式人生 > >python筆記-HTML與CSS

python筆記-HTML與CSS

阿新 • • 發佈：2018-12-12

文字標籤

h1-h6:標題 p:文欄位落標籤 b/strong:加粗 u:下劃線 s:劃去線 換行標籤: br-----(第一個沒有成對出現的標籤) 水平分隔符標籤: hr-----(第一個沒有成對出現的標籤) 預格式化文字標籤(保留文字的原有格式): pre標籤 上標和下標: sup， sub 塊引用標籤: blockquote 普通的文字: span — 行內標籤 普通文字的標籤:div------

Title

標題1

hello

world

hello world

標題2

擊壤歌

先秦：佚名
日出而作，日入而息。
鑿井而飲，耕田而食。
帝力於我何有哉！

hello

world

helloworld
擊壤歌

先秦：佚名 日出而作，日入而息。 鑿井而飲，耕田而食。 帝力於我何有哉！

x2+2x+3 = 5 這個方程的解： x1=3 x2=5

超連結標籤

Title

百度 百度

百度

第一個標題 第2個標題 第3個標題 第4個標題

第一個標題

2018 年，AI 行業持續走向技術落地和深入商業化的一年。

回顧上半年，科技巨頭們在橫向建設自己的 AI 技術平臺時，也更強調 AI 與每一垂直行業的深度融合，而 AI 創業公司除了頻繁重新整理行業高額融資外，也立足於自身優勢，在應用場景中步步為營、累積了不少客戶資源。當然，在熱烈的歡呼聲中，AI 泡沫論調依然在不時迴響，但毋庸置疑的是，那些真正利用 AI 技術來創造出商業價值的企業自然會沉澱下來。

優秀的商業落地產品/技術方案是判斷一個企業商業價值的重要依據。基於此，AI科技大本營（ID:rgznai100）希望找到在汽車、金融、教育、醫療、安防、零售、家居、文娛、工業等 9 大行業的最佳 AI 應用案例 TOP 20，記錄 AI 時代影響人類發展的變革性產品/解決方案。同時我們有理由相信，挖掘出的那些優秀先行者還會給不同 AI 行業領域帶來啟迪，進而推動整個 AI 行業的發展程序。

好產品/技術方案值得記錄，而不是被時代泡沫淹沒。 徵集內容詳情： 案例範圍

徵集 AI 技術在汽車、金融、零售、醫療、教育、安防、家居、文娛、工業等 9 大行業的應用案例（具體內容示例見下文）。 最佳案例評選標準

技術性、創新性、前瞻性 案例分享者特別獎勵

1.50+ 以上媒體平臺的聯合宣傳，各行業上榜的最佳應用案例還可能獲得 AI科技大本營（ID:rgznai100）的專訪報道，在極大提升企業技術品牌影響力的同時，有助於企業從 CSDN 社群吸納優秀的技術人才；

2.選出 20+ 最佳應用案例納入由 CSDN 釋出的《2018-2019 中國人工智慧產業路線圖》，以及由 CSDN 頒發的“2018 中國人工智慧最佳應用案例獎”；

3.入選 2018 最佳人工智慧應用案例 TOP 20 的企業，將優先推薦加入由 CSDN 和 AICAMP 舉辦的 AI 開發者大會智慧應用分論壇做應用案例技術分享，並享有全程會議通道；

4.參與 2018 最佳人工智慧應用案例 TOP 20 的企業將優先邀請 AI科技大本營線公開課的講座或線上下技術沙龍上做分享。 活動時間

2018 年 9-10 月：案例徵集階段 2018 年 11 月：TOP 20 案例公佈及頒獎 聯絡人郵箱：[email protected]

第2個標題

2018 年，AI 行業持續走向技術落地和深入商業化的一年。

回顧上半年，科技巨頭們在橫向建設自己的 AI 技術平臺時，也更強調 AI 與每一垂直行業的深度融合，而 AI 創業公司除了頻繁重新整理行業高額融資外，也立足於自身優勢，在應用場景中步步為營、累積了不少客戶資源。當然，在熱烈的歡呼聲中，AI 泡沫論調依然在不時迴響，但毋庸置疑的是，那些真正利用 AI 技術來創造出商業價值的企業自然會沉澱下來。

優秀的商業落地產品/技術方案是判斷一個企業商業價值的重要依據。基於此，AI科技大本營（ID:rgznai100）希望找到在汽車、金融、教育、醫療、安防、零售、家居、文娛、工業等 9 大行業的最佳 AI 應用案例 TOP 20，記錄 AI 時代影響人類發展的變革性產品/解決方案。同時我們有理由相信，挖掘出的那些優秀先行者還會給不同 AI 行業領域帶來啟迪，進而推動整個 AI 行業的發展程序。

好產品/技術方案值得記錄，而不是被時代泡沫淹沒。 徵集內容詳情： 案例範圍

徵集 AI 技術在汽車、金融、零售、醫療、教育、安防、家居、文娛、工業等 9 大行業的應用案例（具體內容示例見下文）。 最佳案例評選標準

技術性、創新性、前瞻性 案例分享者特別獎勵

1.50+ 以上媒體平臺的聯合宣傳，各行業上榜的最佳應用案例還可能獲得 AI科技大本營（ID:rgznai100）的專訪報道，在極大提升企業技術品牌影響力的同時，有助於企業從 CSDN 社群吸納優秀的技術人才；

2.選出 20+ 最佳應用案例納入由 CSDN 釋出的《2018-2019 中國人工智慧產業路線圖》，以及由 CSDN 頒發的“2018 中國人工智慧最佳應用案例獎”；

3.入選 2018 最佳人工智慧應用案例 TOP 20 的企業，將優先推薦加入由 CSDN 和 AICAMP 舉辦的 AI 開發者大會智慧應用分論壇做應用案例技術分享，並享有全程會議通道；

4.參與 2018 最佳人工智慧應用案例 TOP 20 的企業將優先邀請 AI科技大本營線公開課的講座或線上下技術沙龍上做分享。 活動時間

2018 年 9-10 月：案例徵集階段 2018 年 11 月：TOP 20 案例公佈及頒獎 聯絡人郵箱：[email protected]

第3個標題

2018 年，AI 行業持續走向技術落地和深入商業化的一年。

回顧上半年，科技巨頭們在橫向建設自己的 AI 技術平臺時，也更強調 AI 與每一垂直行業的深度融合，而 AI 創業公司除了頻繁重新整理行業高額融資外，也立足於自身優勢，在應用場景中步步為營、累積了不少客戶資源。當然，在熱烈的歡呼聲中，AI 泡沫論調依然在不時迴響，但毋庸置疑的是，那些真正利用 AI 技術來創造出商業價值的企業自然會沉澱下來。

優秀的商業落地產品/技術方案是判斷一個企業商業價值的重要依據。基於此，AI科技大本營（ID:rgznai100）希望找到在汽車、金融、教育、醫療、安防、零售、家居、文娛、工業等 9 大行業的最佳 AI 應用案例 TOP 20，記錄 AI 時代影響人類發展的變革性產品/解決方案。同時我們有理由相信，挖掘出的那些優秀先行者還會給不同 AI 行業領域帶來啟迪，進而推動整個 AI 行業的發展程序。

好產品/技術方案值得記錄，而不是被時代泡沫淹沒。 徵集內容詳情： 案例範圍

徵集 AI 技術在汽車、金融、零售、醫療、教育、安防、家居、文娛、工業等 9 大行業的應用案例（具體內容示例見下文）。 最佳案例評選標準

技術性、創新性、前瞻性 案例分享者特別獎勵

1.50+ 以上媒體平臺的聯合宣傳，各行業上榜的最佳應用案例還可能獲得 AI科技大本營（ID:rgznai100）的專訪報道，在極大提升企業技術品牌影響力的同時，有助於企業從 CSDN 社群吸納優秀的技術人才；

2.選出 20+ 最佳應用案例納入由 CSDN 釋出的《2018-2019 中國人工智慧產業路線圖》，以及由 CSDN 頒發的“2018 中國人工智慧最佳應用案例獎”；

3.入選 2018 最佳人工智慧應用案例 TOP 20 的企業，將優先推薦加入由 CSDN 和 AICAMP 舉辦的 AI 開發者大會智慧應用分論壇做應用案例技術分享，並享有全程會議通道；

4.參與 2018 最佳人工智慧應用案例 TOP 20 的企業將優先邀請 AI科技大本營線公開課的講座或線上下技術沙龍上做分享。 活動時間

2018 年 9-10 月：案例徵集階段 2018 年 11 月：TOP 20 案例公佈及頒獎 聯絡人郵箱：[email protected]

第4個標題

2018 年，AI 行業持續走向技術落地和深入商業化的一年。

回顧上半年，科技巨頭們在橫向建設自己的 AI 技術平臺時，也更強調 AI 與每一垂直行業的深度融合，而 AI 創業公司除了頻繁重新整理行業高額融資外，也立足於自身優勢，在應用場景中步步為營、累積了不少客戶資源。當然，在熱烈的歡呼聲中，AI 泡沫論調依然在不時迴響，但毋庸置疑的是，那些真正利用 AI 技術來創造出商業價值的企業自然會沉澱下來。

優秀的商業落地產品/技術方案是判斷一個企業商業價值的重要依據。基於此，AI科技大本營（ID:rgznai100）希望找到在汽車、金融、教育、醫療、安防、零售、家居、文娛、工業等 9 大行業的最佳 AI 應用案例 TOP 20，記錄 AI 時代影響人類發展的變革性產品/解決方案。同時我們有理由相信，挖掘出的那些優秀先行者還會給不同 AI 行業領域帶來啟迪，進而推動整個 AI 行業的發展程序。

好產品/技術方案值得記錄，而不是被時代泡沫淹沒。 徵集內容詳情： 案例範圍

徵集 AI 技術在汽車、金融、零售、醫療、教育、安防、家居、文娛、工業等 9 大行業的應用案例（具體內容示例見下文）。 最佳案例評選標準

技術性、創新性、前瞻性 案例分享者特別獎勵

1.50+ 以上媒體平臺的聯合宣傳，各行業上榜的最佳應用案例還可能獲得 AI科技大本營（ID:rgznai100）的專訪報道，在極大提升企業技術品牌影響力的同時，有助於企業從 CSDN 社群吸納優秀的技術人才；

2.選出 20+ 最佳應用案例納入由 CSDN 釋出的《2018-2019 中國人工智慧產業路線圖》，以及由 CSDN 頒發的“2018 中國人工智慧最佳應用案例獎”；

3.入選 2018 最佳人工智慧應用案例 TOP 20 的企業，將優先推薦加入由 CSDN 和 AICAMP 舉辦的 AI 開發者大會智慧應用分論壇做應用案例技術分享，並享有全程會議通道；

4.參與 2018 最佳人工智慧應用案例 TOP 20 的企業將優先邀請 AI科技大本營線公開課的講座或線上下技術沙龍上做分享。 活動時間

2018 年 9-10 月：案例徵集階段 2018 年 11 月：TOP 20 案例公佈及頒獎 聯絡人郵箱：[email protected]

圖片標籤

Title

AI會議即將開始: img01.jpg AI會議即將開始: img01.jpg AI會議即將開始: img01.jpg

AI會議即將開始: img01.jpg AI會議即將開始: img01.jpg

序列化標籤

Title

無序標籤

  • HTML
  • CSS
  • JS
  • python
  • CSS
  • JS
  • python
  1. html
  2. CSS
  3. JS
HTML
li
span
div
hr
sub
CSS
text-decoration
color

表格標籤

Title 
<tr>
    <td>server1</td>
    <td>172.25.254.250</td>
</tr>
<tr>
    <td>server1</td>
    <td>172.25.254.250</td>
</tr>
<tr>
    <td>server1</td>
    <td>172.25.254.250</td>
</tr>
<tr>
    <td>server1</td>
    <td>172.25.254.250</td>
</tr>
表格的標題
主機名 IP地址
server1 172.25.254.250

合併列單元格

Title
主機名 IP
server1 172.25.254.2 172.25.254.2 172.25.254.2
server1 172.25.254.2 172.25.254.2 172.25.254.2
server1 172.25.254.2 172.25.254.2 172.25.254.2

合併行單元格

Title 
<tr>
    <td rowspan="3">IP</td>
    <td>172.25.254.2</td>
    <td>172.25.254.2</td>
    <td>172.25.254.2</td>
</tr>

<tr>
    <td>172.25.254.2</td>
    <td>172.25.254.2</td>
    <td>172.25.254.2</td>
</tr>
<tr>
    <td>172.25.254.2</td>
    <td>172.25.254.2</td>
    <td>172.25.254.2</td>
</tr>
主機名 server1 server2 server3

表格巢狀標籤

Title
  • html
  • html
  • html
 
                fkjrefre
                trgtrhryt
hdhefreg

表單標籤

Title 
<!--&lt;!&ndash;文字域&ndash;&gt;-->
<!--<span>使用者名稱: </span><input type="text"><br/>-->
<!--&lt;!&ndash;密碼域&ndash;&gt;-->
<!--<span>密碼:</span><input type="password">-->
<!--<br/>-->
<!--&lt;!&ndash;文字域&ndash;&gt;-->
<!--<span>個人簡介:</span><textarea>-->
<!--</textarea><br/>-->
<!--&lt;!&ndash;提交檔案&ndash;&gt;-->
<!--<span>個人簡歷：</span><input type="file"><br/>-->

<!--&lt;!&ndash;日期&ndash;&gt;-->
<!--<span>出生日期:</span><input type="date">-->

<!--&lt;!&ndash;提交按鈕&ndash;&gt;-->
<!--<input type="submit" value="登陸">-->
<!--<input type="reset" value="重置">-->

詳細資訊

性別:

男 女

你喜歡的書籍:

  • java
  • python1
  • python2
  • python3
--選擇省份-- 陝西 山西 河南 河北 個人簡介

使用者登陸

使用者名稱:

個人資訊表

Title

個人資訊

姓名 性別 男 女 
    </td>
</tr>
<tr>
    <td>手機號碼</td>
    <td><input style="width: 95%; " type="tel"></td>
    <td>電子郵箱</td>
    <td><input style="width: 95%; " type="email"></td>
</tr>
<tr>
    <td>教育程度</td>
    <td><input style="width: 95%; " type="text"></td>
    <td>工作職位</td>
    <td><input style="width: 95%; " type="text"></td>
</tr>
<tr>
    <td>工作城市</td>
    <td><input style="width: 95%; " type="text"></td>
    <td>期望工資</td>
    <td><input style="width: 95%; " type="text"></td>
</tr>
<tr>
    <td>自我介紹</td>
    <td colspan="3"><input type="text" style="width: 98%"></td>

</tr>
<tr>
    <td>特長</td>
    <td colspan="3"><input style="width: 95%; " type="text"></td>

</tr>
<tr>
    <td>地址</td>
    <td colspan="3"><input style="width: 95%; " type="text"></td>

</tr>
<tr>
    <td colspan="4"><br/></td>

</tr>
<tr>
    <td colspan="4" align="right">
        <input type="submit" value="新增">
        <input type="reset" value="關閉">
    </td>

</tr>

CSS和div和span的理解

div相關的技術:

div是一個html標籤, 一個塊級元素(單獨顯示一行), 單獨使用沒有任何意義, 必須結合CSS來使用, 主要用於頁面的佈局; span是一個html標籤, 一個內聯元素(顯示一行), 它單獨使用沒有任何意義, 必須結合css使用, 主要對括起來的內容進行樣式的修飾;

CSS 概述 CSS 指層疊樣式表 (Cascading Style Sheets) 樣式定義如何顯示 HTML 元素 樣式通常儲存在樣式表中 把樣式新增到 HTML 4.0 中，是為了解決內容與表現分離的問題 外部樣式表可以極大提高工作效率 外部樣式表通常儲存在 CSS 檔案中 多個樣式定義可層疊為一

總結:

學習的行內標籤和 塊級元素分別有哪些? 行內標籤:span, strong, a, img, input, textarea 塊級元素:div, h1-h6, p, hr, pre, ul, ol, dd, dt, th. tr, td

兩者的區別與特性； 1).塊級元素獨佔一行空間， 行內元素只佔據自身寬度的空間; 2).塊級元素是可以包含塊級元素和行內元素; 行內元素只能包含文字資訊和行內元素; 3). 塊級元素可以設定寬和高， 行內元素設定的寬和高失效；

如何讓塊級元素居中? 如何讓行內元素居中? 1); 塊級元素居中： margin: 0 auto 2> 行內元素居中: text-aligin:center

編寫CSS樣式_類選擇器

Title 1 2 3 4 5

編寫CSS樣式_標籤選擇器

Title 
<!--box-shadow: 1px 1px 3px #888888;">hello</div>-->
1 2 3

id選擇器

Title 1 2 3

CSS練習 導航欄

Title
  • HTML
  • CSS
  • JS
  • python

CSS練習分頁

Title

層級選擇器

Title
  1. 新聞1
  2. 新聞2
  3. 新聞3
姓名: 密碼:

CSS的引入方式

Title
  • HTML
  • CSS
  • JS
  • python

簡易版唯品會登陸介面

Title 唯品會 
<div id="login">
    <h3>賬戶登陸</h3>
    <hr/>
    <form action="#" method="get">
    <input class="a" type="text" placeholder="使用者名稱/郵箱/電話"><br/>
    <input class="a" type="password" placeholder="密碼"><br/>
    <input type="radio" name="choice" value="1"><span>記住使用者名稱</span><br/>

        <input type="submit" value="登陸">


    </form>


</div>

相關推薦

python筆記-HTML與CSS

文字標籤 h1-h6:標題 p:文欄位落標籤 b/strong:加粗 u:下劃線 s:劃去線 換行標籤: br-----(第一個沒有成對出現的標籤) 水平分隔符標籤: hr-----(第一個沒有成對出現的標籤) 預格式化文字標籤(保留文字的原有格式): pre標

兄弟連學Python（4）—Python前端HTML與CSS初步認識

什麼是HTML？ HTML： 超文字標記語言，標準通用標記語言下的一個應用。 “超文字”就是指頁面內可以包含圖片、連結，甚至音樂、程式等非文字元素。 超文字標記語言的結構包括“頭”部分（英語：Head）、和“主體”部分（英語：Body），其中“頭”部提供關於網頁的資

【幹貨】Html與CSS入門學習筆記12-14【完】

進度條 tom step char number 視頻容器 復選框 其中 私有 十二、HTML5標記 現代HTML html5新增的元素：header nav footer aside section article time 這些新增元素使頁面結構更清晰，取代<di

《Head First HTML與CSS 》筆記-0x7

目錄   區塊<section>和文章<article>的區別 <vedio> <table>表格 列表定製樣式 list-style-image <form>表單 End

《Head First HTML與CSS 》筆記-0x6

目錄   流（Flow） 用float浮動元素 用clear解決重疊問題 流體佈局（liquid layouts） 凍結佈局（frozen layouts） 凝膠布局（Jello） 絕對定位absolute CSS表格 固定定位 四種定位方式

《Head First HTML與CSS 》筆記-0x5

目錄 使用<div>標記邏輯區 子孫選擇器 使用<span>建立內聯字元和元素的邏輯分組 <a>元素狀態樣式設定 偽類（Pseudo-class） 層疊 使用&ltdiv&gt標記邏輯區

前端HTML與CSS學習筆記總結篇(超詳細)

第一部分 HTML 第一章 職業規劃和前景 職業方向規劃定位： web前端開發工程師web網站架構師自己創業轉崗管理或其他 web前端開發的前景展望： 未來IT行業企業需求最多的人才結合最新的html5搶佔移動端的

HTML與CSS

表現 構建 alt 寫代碼 是我 艱辛 代碼 log 效果 　　Html是用來做框架結構的，css用來排版的。 　　html就好比是一棟房子的主體框架，而css就是室內的墻壁門框窗戶這些。只有主體框架了才能在這基礎上去發揮css的功用。 　　要想做好一個好的網頁，結構一定要

Web前端開發精品課HTML與CSS基礎教程 (莫振傑著) 完整pdf掃描版

OS 選擇器 鏈接樣式 大量 整理 培養 分享圖片 mage 入門 Web前端開發精品課：HTML與CSS基礎教程結合大量開發實戰經驗，將前端開發知識系統化整理，濃縮精華，用通俗易懂的語言直指初學者的痛點。 全書分為兩部分：首部分是HTML基礎知識，幫助讀者認識和理解網

你不懂得HTML與CSS的戀情發展史

html css h5 css3 javascript HTML與CSS 樣式表的歷史科普 自從1990年代初HTML被發明，作為HTML代碼輔助的樣式表，就以各種形式出現； 最初，不同的瀏覽器結合了它們各自的樣式語言，讀者可以使用這些樣式語言來調節網頁的顯示方式；一開始樣式表是給讀者用的

html與CSS補充內容

rap 後臺管理 補充 pos osi col oot ;內 trap 1、基本的架子 float clear：both margin padding 如果需要指定一個東西在特定的位置就需要用到 position： left： 如果不好

前端HTML 與css 整理（未完）

簽名 跳轉 doc emp 分類 for ... 小寫 tar HTML 中的標簽存放於文本文件中 需要按照以下固定的文檔結構組織：<!DOCTYPE HTML><html> <head>頭部相關信息 </head>

Python筆記10（CSS）

耦合性 適應 選中 提高 ora 學習 筆記 ava tex 一、css的引入方式 1、css介紹 現在的互聯網前端分三層： HTML：超文本標記語言。從語義的角度描述頁面結構。 CSS：層疊樣式表。從審美的角度負責頁面樣式。 JS：JavaScript 。從

HTML與CSS布局技巧總結

overflow 絕對定位 back hidden port 子元素 屏幕 hex key 很多人對CSS的布局有困惑，實際的應用場景中由於布局種類多難以選擇。今天我花些時間總結下自己對CSS布局的理解，分析下了解各種布局的優劣，同時希望能分享給初入前端的朋友

html與css學習1

劃分 代碼 之路 裏的 而是 小時 框架 F12 描述 html是接觸很久了，或許很多人覺得這個東西很簡單，是的，他其實就是一些再簡單不過的標簽組成，所有標簽的意思在w3school裏面1小時就能看完（記不記住關系不大，看久了自然記住了），這個文章當然不是生搬如何使用標簽的

Html與Css關聯到一起

文件 頁面 開始 a標簽 屬性 relation charset 通知 需要 在HTML文件中使用Link標簽連接獨立的Css文件 　　將Link標簽放在head標簽中 　　like標簽是空標簽，只寫開始標簽，不寫結束標簽 我們需要為like標簽設置一些屬性 　　typ

HTML與CSS基礎知識

行編輯 區別 問題 margin div external 兩個 .... 特殊 HTML 1.文本標簽 - 水平分隔符標簽: <hr> - 預格式化文本標簽(保留文本的原有格式): <pre>文字</pre> - 將文字設置為上標或下標

[Python筆記]enumerate與zip使用的例子

1.enumerate是內建函式,用於迭代索引-值對 2.zip用於並行兩個序列的同時迭代時將兩個序列"縫合",返回一個由元組組成的序列 str=['a','b','c'] index=[] string=[] for i,s in enumerate(str): index.a

Html與CSS學習記錄四

HTML5新標籤和特性     *header：定義文件的頁首 頭部     *aside：定義其所處內容之外的內容 側邊     *article：定義文章。 <!DOCTYPE htm

Html與CSS學習記錄三

元素的顯示與隱藏 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <