【PHP微職位】第3天學習筆記

阿新 • • 發佈：2018-09-05

spa 電子郵件 tex dex 表單需要郵件 keyword acc

學習課程：《Html5第一季》6~11節
學習時間：2018-09-04

**表格元素**
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <title>表格元素</title>
</head>
<body>
<!-- 基本表格 -->
<table border="1">  
    <tr>
        <td>張三</td>
        <td>男</td>
        <td>未婚</td>
    </tr>
    <tr>
        <td>李四</td>
        <td>女</td>
        <td>已婚</td>
    </tr>
</table>

<br>
<!-- 橫向和縱向單元格 -->
<table border="1" style="width: 300px">  
    <tr>
        <th rowspan="4">基本情況</th>
        <th>姓名</th>
        <th>性別</th>
        <th>婚否</th>
    </tr>
    <tr>
        <td>張三</td>
        <td>男</td>
        <td>未婚</td>
    </tr>
    <tr>
        <td>李四</td>
        <td>女</td>
        <td>已婚</td>
    </tr>
    <tr>
        <td colspan="3">統計：合計2人</td>
    </tr>
</table>

<br>
<!-- thead tbody和tfoot -->
<table border="1" style="width: 300px"> 
    <caption>這是一個表格</caption>  <!-- 添加標題 -->
    <thead> 
        <tr>
            <th>姓名</th>
            <th>性別</th>
            <th>婚否</th>
        </tr>
    </thead>
    <tbody>
        <tr style="background: red">
            <td>張三</td>
            <td>男</td>
            <td>未婚</td>
        </tr>
        <tr>
            <td>李四</td>
            <td>女</td>
            <td>已婚</td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td colspan="3">統計：合計2人</td>
        </tr>
    </tfoot>
</table>

<br>
<!-- 設置列顏色方法案例1 -->
<table border="1" style="width: 300PX"> 
    <colgroup style="background: red" span="2"></colgroup>
    <tr>
        <th>姓名</th>
        <th>性別</th>
        <th>婚否</th>
    </tr>
    <tr>
        <td>張三</td>
        <td>男</td>
        <td>未婚</td>
    </tr>
    <tr>
        <td>李四</td>
        <td>女</td>
        <td>已婚</td>
    </tr>
</table>

<br>
<!-- 設置列顏色方法案例2 -->
<table border="1" style="width: 300PX"> 
    <colgroup style="background: white" span="1"></colgroup>
    <colgroup style="background: red" span="1"></colgroup>
    <tr>
        <th>姓名</th>
        <th>性別</th>
        <th>婚否</th>
    </tr>
    <tr>
        <td>張三</td>
        <td>男</td>
        <td>未婚</td>
    </tr>
    <tr>
        <td>李四</td>
        <td>女</td>
        <td>已婚</td>
    </tr>
</table>
<br>
<!-- 設置列顏色方法案例3 -->
<table border="1" style="width: 300PX"> 
    <colgroup>
        <col>
        <col style="background: red">
    </colgroup>
    <tr>
        <th>姓名</th>
        <th>性別</th>
        <th>婚否</th>
    </tr>
    <tr>
        <td>張三</td>
        <td>男</td>
        <td>未婚</td>
    </tr>
    <tr>
        <td>李四</td>
        <td>女</td>
        <td>已婚</td>
    </tr>
</table>
</body>
</html>

**文檔元素**
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <title>文檔元素</title>
</head>
<body>

<!-- 頁面標頭部分,屬於區塊，下面內容會換行 -->
<header>
    <hgroup>
        <h1>這是一個h1大標題</h1>
        <h4>這是一個h4副標題</h4>
    </hgroup>
    <nav>這裏是一個導航</nav>
    這裏存放頁面標頭部分：LOGO 標題 導航
</header>

<section>
    這裏是文檔主題部分
</section>

<article>
    <header>...</header>
    <section>...</section>
    <footer>...</footer>
</article>

<aside>...</aside>

<footer>
    這裏存放的頁面的尾部：版權聲明 友情鏈接
    <h4>這是一個尾部h4副標題</h4>
    <address>這是聯系方式</address>
</footer>
</body>
</html>

**嵌入元素**
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <title>嵌入元素</title>
</head>
<body>

<!-- <a href="index.html">
    <img ismap src="1.jpg" alt="風景圖" width="200" height="200">
</a> -->

<!-- 創建分區響應，熱點區域 -->
<!-- <a href="index.html">
    <img src="1.jpg" alt="風景圖" width="200" height="200" border="0" usemap="#Map">
    <map name="Map">
      <area shape="rect" coords="10,24,95,97" href="http://www.baidu.com" target="_blank" alt="百度">
      <area shape="circle" coords="145,64,42" href="http://www.so.com" target="_blank" alt="SOSO">
      <area shape="poly" coords="18,123" href="#">
      <area shape="poly" coords="50,114,50,163" href="#">
      <area shape="poly" coords="17,117,16,173,169,177,167,131,167,121" href="http://www.sougou.com" target="_blank" alt="搜狗">
    </map>
</a> -->
<!-- <img src="11.jpg">
<img src="11.jpg" alt="風景圖"> -->

<!-- 一個區域引入固定區域 -->
<!-- <a href="http://www.baidu.com" target="in">百度</a>丨<a href="http://www.soso.com" target="in">好搜</a>
<br>
<iframe src="http://www.soso.com" width="800" height="400" name="in"></iframe> -->

<!-- 插入flash文件 -->
<!-- <embed src="flash.swf" type="application/x-shockwave-flash" width="400" height="200">
</embed> -->

<!-- 進度條 -->
<progress value="30" max="100"></progress>

<meter value="66" min="10" max="100" low="30" high="80" optimum="66"></meter>

</body>
</html>

**音頻和視頻**
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <title>音頻和視頻</title>
</head>
<body>

<!-- webm mpeg-4 ogg -->

<!-- <video src="1.mp4" width="600" height="200" controls="" autoplay="" loop="" muted=""></video> -->

<!-- <video src="1.mp4" width="600" height="200" controls="" poster="1.jpg"></video> -->

<!-- <video src="1.mp4" width="600" height="200" controls="" poster="1.jpg" preload=""></video> -->

<!-- <video src="1.mp4" width="600" height="200" controls="" poster="1.jpg" preload="metadata"></video> -->

<!-- <video src="1.mp4" width="600" height="200" controls="" poster="1.jpg" preload="autoplay"></video> -->

<!-- <video width="600" height="200" controls="">
    <source src="1.mp4" type="">
    <source src="1.webm" type="">
    <source src="1.ogg" type="">
    <object>實現Flash插件的播放，如果屏蔽IE9以下則不需要</object>
</video> -->
<!-- 
<audio src="1.mp3"></audio> -->

<audio controls="">
    <source src="1.mp3" type="">
    <source src="1.m4a" type="">
    <source src="1.wav" type="">
</audio>
</body>
</html>

**表格元素**
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <title>表單元素[上]</title>
</head>
<body>

<form id="register" method="get" name="reg" action="http://www.baidu.com" target="_blank" autocomplete="on">
<!--    用戶名： <input type="" name="user" autofocus disabled="">   -->
<fieldset>
     <legend>註冊分組</legend>
    <label for="user">
        用戶名： 
    </label>
    <input id="user" name="user" autocomplete="off" value="請輸入賬號"><br>
<!--    <button>提交</button> -->
    <label>
        電子郵件： <input type="" name="bbs" form="register">
    </label>
</fieldset>
</form>
    <button type="submit" form="register">提交</button>
    <button type="reset" form="register">重置</button>
    <button type="button" form="register">其他</button>
</body>
</html>

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <title>表單元素[中]</title>
</head>
<body>

<form action="http://www.so.com">
    <!-- <input type="text" name="user" maxlength="5" size="30" value="11111" disabled> -->

    <!-- <input type="text" list="abc" required=""> -->

    <!-- <input type="password" name="" placeholder="請輸入密碼"> -->

    <!-- <input type="search" name=""> -->

    <!-- <input type="number" name="" min="10" max="100" step="5"> -->

    <!-- <input type="date" name="">
    <input type="month" name="">
    <input type="time" name="">
    <input type="week" name="">
    <input type="datetime" name="">
    <input type="datetime-local" name=""> -->

    <!-- <input type="color" name="color"> -->

<!--    音樂 <input type="checkbox" name="music" value="1">
    音樂 <input type="checkbox" name="sport" value="2"> -->

<!--    <input type="radio" name="sex" value="1">男
    <input type="radio" name="sex" value="2" checked>女 -->

<!--    <input type="submit" name="">提交
    <input type="reset" name="">重置
    <input type="button" name="">一般按鈕 -->

    <!-- <input type="image" src="1.jpg"> -->

<!--    <input type="email" name="">
    <input type="tel" name="">
    <input type="url" name=""> -->

    <!-- <input type="hidden" name="id" value="1"> -->

    <input type="file" name="" accept="image/gif">

    <button>提交</button>

</form>

<datalist id="abc">
    <option value="1">蘋果</option>
    <option value="2">橘子</option>
    <option value="3" label="香蕉">
    <option value="菠蘿">
</datalist>

</body>
</html>

<!DOCTYPE html>
<html>
<head lang="zh-cn">
    <meta charset="utf-8">
    <title> 表單元素[下]</title>
</head>
<body>
<form action="http://www.baidu.com" oninput="res.value = num1.valueAsNumber*num2.valueAsNumber" novalidate="">
<!--    <select name="fruit" size="10" multiple="">
        <optgroup label="水果">
            <option value="1">蘋果</option>
            <option value="2" selected="">橘子</option>
            <option value="3">香蕉</option>
        </optgroup>
        <optgroup label="粗糧">
            <option value="4">小米</option>
            <option value="5">大米</option>
            <option value="6">玉米</option>
        </optgroup>
    </select> -->

<!-- <textarea name="content" rows="10" cols="10" wrap="">請留下您的建議！</textarea> -->

<!--    <input type="number" id="num1">X<input type="number" id="num2">=
    <output for="num1 num2" name="res"></output> -->
<!--    <input type="text" required="">
    <input type="number" min="10" max="100"> -->
    <input type="text" placeholder="請輸入區號+座機" pattern="^[\d]{2,4}\-[\d]{6,8}$" name="" required="">

    <button>提交</button>
</form>
</body>
</html>

**全局屬性和其他**
<!DOCTYPE html>
<html>
<head lang="zh-cn">
    <!-- <meta charset="utf-8"> -->
    <meta name="autor" content="bbs">
    <meta name="description" content="這是一個描述">
    <meta name="keywords" content="php;開發">
    <meta http-equiv="content-type" content="text/html charset=utf-8">
    <!-- <meta http-equiv="refresh" content="3;http://www.baidu.com"> -->
    <title>全局屬性和其他</title>
    <style type="text/css">
        #abc{
            color: red
        }
        .abc{
            color: blue
        }
    </style>
</head>
<body>

<div>1</div>

<div>

我?????你

?

這是一段中文

<!--    <p id="abc">這是id</p>
 -->
<!--    <p class="abc">1</p>
    <p class="abc">2</p>
    <p class="abc">3</p> -->
    <!-- <input type="text" name="" accesskey="L"> -->

<p contenteditable="">我可以修改嗎</p>

    <P dir="rtl" hidden>文字方向</P>

    <p lang="en" title="這是一個html5教程" style="color: red">Html5</p>

    <input type="text" name="user" tabindex="2">

    <input type="text" name="user" tabindex="1">  <!-- -1不會被選中 -->

</body>
</html>

【PHP微職位】第3天學習筆記

spa 電子郵件 tex dex 表單需要郵件 keyword acc 學習課程：《Html5第一季》6~11節學習時間：2018-09-04 **表格元素** <!DOCTYPE html> <html lang="zh-cn"> <

【PHP微職位】第1天學習筆記

核心工程階段基礎基礎篇 php 項目 3.x art 2018年8月22日學習內容：第一節開班典禮以及課堂體系概述【基礎預科】1、HTML5(Web設計入門基礎)視頻課程【1~2周】【必學】2、Bootstrap(HTML5前端庫設計開發)視頻課程【1周】【必學

第十二、十三周作業【Linux微職位】

馬哥教育一、結合圖形描述LVS的工作原理；lvs-nat模型主要是修改目標IP地址為挑選出新的RS的IP地址。即請求進入負載均衡器時做DNAT，響應出負載均衡器時做SNAT。1.當用戶請求到達Director Server，此時請求的數據報文會先到達內核的PREROUTING鏈，此時報文的源IP是CIP，目標

Linux系統管理第四周作業【Linux微職位】

filesystem raid swap 1、創建一個10G分區，並格式為ext4文件系統；(1) 要求其block大小為2048, 預留空間百分比為2, 卷標為MYDATA, 默認掛載屬性包含acl；創建分區[[email protected]/* */ Desktop]# fdis

Linux系統管理第七周作業【Linux微職位】

bash腳本編程1、寫一個腳本，判斷當前系統上所有用戶的shell是否為可登錄shell（即用戶的shell不是/sbin/nologin）；分別這兩類用戶的個數；通過字符串比較來實現；[[email protected]/* */ ~]# vim usershell.sh #!/bin/bash

Linux服務及安全管理第八周作業【Linux微職位】

加密解密技術;ca;dns1、詳細描述一次加密通訊的過程，結合圖示最佳。一次完整的加密通訊過程如下：通訊的雙方需要事先協商好單向加密算法，並交換各自的公鑰發送端加密過程1、發送端先用單向加密算法計算出數據的特征碼2、發送端用自己的私鑰加密特征碼，生成數字簽名，並將該數字簽名附加在數據之後3、發送端生成一個臨時

Linux服務及安全管理第九周作業【Linux微職位】

http1、請描述一次完整的http請求處理過程；(1)建立或處理連接：接收請求或拒絕請求；(2)接收請求：接收來自於網絡上的主機請求報文中對某特定資源的一次請求的過程；(3)處理請求：對請求報文進行解析，獲取客戶端請求的資源及請求方法等相關信息；(4)訪問資源：獲取請求報文中請求的資源；(5)構建響應報文：

Linux基礎入門第三周作業【Linux微職位】

bash基礎特性之文件名通配(globbing)1、顯示/var目錄下所有以l開頭，以一個小寫字母結尾，且中間至少出現一位數字（可以有其它字符）的文件或目錄。ls -d /var/l*[0-9]*[[:lower:]]或ls -d /var/l*[[:digit:]]*[[:lower:]]命令測試結果[[e

【構建之法】第3章軟件工程師的成長

問題解決技術相關依賴問題自動操作層次 nbsp align 思想 1 軟件工程師的成長積累軟件開發相關的知識，提升技術技能積累問題領域的知識和經驗對通用的軟件設計思想和軟件工程思想的理解提升職業技能實際成果 2 軟件工程師的思維思維誤區分析麻痹

【java微職位】51CTO學習總結

【java微職位】51CTO學習總結【java微職位】51CTO學習總結通過半年的學習終於學完了本課程按時結業，通過這個課程的學習自己感覺很有收獲，回想這半年來的學習時間還是有些感慨，做下小的總結。一、學習習慣的養成。學習是一個連貫的過程，也是一件需要持之以恒的事情。java微職位這個課程涵蓋的東西非常廣

【RTX作業系統教程】第3章初學RTX作業系統準備工作

第3章初學RTX作業系統準備工作俗話說萬事開頭難，學習一門新的知識，往往難的不是知識本身，而是如何快速上手，需要什麼資料和開發環境，一旦上手後，深入的學習相對就要容易些了。本章節就起到這樣的作用，主要說明下初學RTX作業系統需要做的準備工作。

【Java8網路程式設計】第3章. HTTP和URLConnection類

1.HTTP基本概念 HTTP（HyperText Transport Protocol）是超文字傳輸協議的縮寫，它用於傳送WWW方式的資料。HTTP協議採用了請求/響應模型。客戶端向伺服器傳送一個請求，請求頭包含請求的方法、URL、協議版本、以及包含請求修飾

【51CTO微職位】-大數據高級工程師2018年學習總結及2019年學習規劃

esri pre 問題 solr 點積成就感 zepplin 視頻筆記知識本人是從零基礎開始學本課程。java是2017年下半年看《java從入門到精通》掌握一點基礎，但沒有完整寫過一個Java項目代碼，可以說是代碼量為零。2018年8月10日，正式開始51CTO微職

【蛻變之路】第1天規劃（2019年2月19日）

每日分享左右一個十分鐘等等英語籃球記錄聲明：本人是一名剛步入社會的職場小白，主要從事Java後端開發。開啟【蛻變一路】系列主要是為了記錄每日學習、思考以及總結的情況，目的是為了不斷挑戰自己，提升

【數據結構】第三章學習小結

truct 如果數值 tps 包括 https stack 判斷 .com 第三章知識小結一.棧（特點是後進先出--LIFO) 1.抽象數據類型（ADT) ADT：stack InitStack(Stack &S); Push(Stack &S

第四天學習筆記

inux linux from lex 添加是不是不可變 type 默認字符串數字列表元組字典 #############變量的分類可變與不可變 1、可變：列表，字典 2、不可變：字符串、元組、數字訪問順序： 1、順序訪問：字符串、列表、元組有序

（原）JavaScript高級程序設計(第3版)--學習筆記--000001

pup 3D LG ss7 rpn osx ken base data 一個完整的JavaScript實現應該由下列三個不同的部分組成： * 核心（ECMAScript） * 文檔對象模型（DOM） * 瀏覽器對象模型（BOM

（原）JavaScript高級程序設計(第3版)--學習筆記--02: 在HTML中使用JavaScritp--0006--<noscript>元素

span 不支持 scrip src 高級 2.4 高級程序設計 example 否則 2.4 <noscript>元素在<noscript>元素中的內容只有在下列情況下才會顯示出來： * 瀏覽器不支持腳本； * 瀏覽器致辭腳本，但腳本被禁用

（原）JavaScript高級程序設計(第3版)--學習筆記--02: 在HTML中使用JavaScritp--0007--總結

標簽高級程序設計情況下嵌入順序執行設置學習筆記混合執行順序小結在 JavaScript 插入到 HTML 頁面中要使用<script>元素。使用這個元素可以把 JavaScript 嵌入到 HTML 頁面中，讓腳本與標記混合在一起；也可以包含

【文文殿下】Manache算法-學習筆記

inf 最長回文子串學習筆記解釋 ont 最長 reg 開頭時間復雜度 Manache算法　　是一個判斷回文子串的算法，我們結合例題解釋：　　　　　　　題目：給定一個長度為 n 的字符串 S，求其最長回文子串一個字符串是回文的，當且僅當反轉後的串與原串完

【PHP微職位】第3天學習筆記

相關推薦