HTNL筆記整合

簡述概括了HTML 的部分內容,不是很完善,希望能給予你們相對的幫助。
一下文件的整合百度云鏈接:HTML整合筆記

第一章 HTML入門

課時1:HTML初識

1、英文名(Hyper Text Markup Language)超文本標簽語言
對網頁上的內容進行描述

課時2:HTML骨架(記憶方法)
在這里插入圖片描述
課時3:我的第一個頁面及其標簽簡介
在這里插入圖片描述

課時4:什么是標簽及其分類

在這里插入圖片描述

課時5:標簽嵌套和并列關系
在這里插入圖片描述
在這里插入圖片描述
如果兩個標簽之間的關系是嵌套關系,子元素最好縮進一個tab鍵的身位(一個tab是4個空格)。如果是并列關系,最好上下對齊。

課時6:簡單小測驗
在這里插入圖片描述

課時7:開發工具

	新手建議,隨便啦,練習階段,能開發前端的,什么工具都行。可以 “百度” 找一下,新生改用哪些前端開發軟件好用就行了。加油!!!么么噠。。本人用的  sublime 開發軟件。

課時8:sublime生成html骨架
在這里插入圖片描述
課時9:doctype文檔類型
在這里插入圖片描述
在這里插入圖片描述
在這里插入圖片描述

課時10:字符集簡介
在這里插入圖片描述

第二章 : HTML標簽

課時11:標簽的語義化及標題標簽
在這里插入圖片描述

2、標題標簽 <h1> ~ <h6>在這里插入圖片描述
標題標簽的最高只能設置到 h6 ,成 1~6 的遞減模式

注意:因為h1的標簽最大, 盡量少用。

課時12:段落標簽和水平線標簽
1、段落標簽 <p> </p>
<p></p>段落標簽進行段落的劃分,從而言簡意賅。
在這里插入圖片描述
2、水平標簽 <hr/>
通過添加 <hr/> 水平標簽,設置水平線,進行內容的分割

在這里插入圖片描述

注意: 標簽的顯示不一: 有 <p> 開始 </p> 結束的, / 結束時在前

有直接 < hr / > 結束的,/ 結束時在后

課時13:課堂案例-新聞頁面

在這里插入圖片描述
課時14:換行和div span標簽

1、換行 <br/> 在這里插入圖片描述
2、div大盒子 span小盒子 標簽
在這里插入圖片描述
課時15:文本格式化標簽

在這里插入圖片描述
在這里插入圖片描述
課時16:標簽屬性
在這里插入圖片描述
在這里插入圖片描述
屬性設置,不分前后順序。

課時17:圖像標簽
在這里插入圖片描述
在這里插入圖片描述
在這里插入圖片描述
img的屬性有 高寬,**width、 height、**文本框 border 等。。。。
Title: 點擊相應的圖片時,出現圖片的說明顯示
Alt: 圖片加載不成功,及未放圖片的說明

課時18:鏈接標簽
在這里插入圖片描述
在這里插入圖片描述
Href屬性為鏈接的地址
Target屬性為新建打開網頁窗口

課時19:錨點定位
在這里插入圖片描述
在這里插入圖片描述
課時20:base標簽
在這里插入圖片描述
在這里插入圖片描述
課時21:特殊字符

特殊字符對應查詢鏈接:

課時22:注釋標簽(此注釋為html中的注釋樣式)
在這里插入圖片描述

課時23:路徑選擇
在這里插入圖片描述
在這里插入圖片描述
課時24:無序列表的使用
在這里插入圖片描述
屬性: type : 空心圓 circle \ 實心圓disc\實心方塊square . 默認disc

課時25:無序列表注意事項

1、

    中只能嵌套
    • ,直接在
        標簽中輸入其他標簽或者文字的做法是不被允許的。
        2、
      • 之間相當于一個容器,可以容納所有元素。
        3、 無序列表會帶有自己樣式屬性,放下那個樣式,一會讓CSS來

        課時26:有序列表
        在這里插入圖片描述
        在這里插入圖片描述
        屬性: type : 設置拍尋方式 1(數字為默認) ai 三種

        課時27:四大名著案例
        在這里插入圖片描述

        課時28:自定義列表

        在這里插入圖片描述
        在這里插入圖片描述
        在這里插入圖片描述課時29:創建表格
        平時開發,這三個參數 border cellpadding cellspacing 為 0
        在這里插入圖片描述
        在這里插入圖片描述
        在這里插入圖片描述
        在這里插入圖片描述
        課時30:合并單元格

        1. 合并單元格2種方式
          跨行合并:rowspan=“合并單元格的個數”
          跨列合并:colspan=“合并單元格的個數”
        2. 合并單元格順序
          合并的順序我們按照 先上 后下 先左 后右 的順序
        3. 合并單元格三步曲
          1.先確定是跨行還是跨列合并
          2.根據 先上 后下 先左 后右的原則找到目標單元格 然后寫上 合并方式 還有 要合并的單元格數量
          3.刪除多余的單元格 單元格
          在這里插入圖片描述
          在這里插入圖片描述
          課時31:表單標簽的掌握

        一、 input 控件(重點)
        語法:在這里插入圖片描述

        • input 輸入的意思
        • 標簽為單標簽
        • type屬性設置不同的屬性值用來指定不同的控件類型
        • 除了type屬性還有別的屬性

        常用屬性:
        在這里插入圖片描述
        在這里插入圖片描述
        在這里插入圖片描述
        二、label標簽(理解)
        在這里插入圖片描述
        三、textarea控件(文本域)
        在這里插入圖片描述
        四、select下拉列表
        目的:
        如果有多個選項讓用戶選擇,為了節約空間,我們可以使用select控件定義下拉列表.
        在這里插入圖片描述
        五、form表單域
        在這里插入圖片描述
        六、團隊約定
        在這里插入圖片描述

      本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
      如若轉載,請注明出處:http://www.pswp.cn/news/248345.shtml
      繁體地址,請注明出處:http://hk.pswp.cn/news/248345.shtml
      英文地址,請注明出處:http://en.pswp.cn/news/248345.shtml

      如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

      相關文章

      EXCEL 圖表 只在拐點的時候顯示數字

      EXCEL圖表只在折線的拐點顯示數值&#xff0c;中間不需要顯示。同時往下拐的&#xff0c;顯示在上方&#xff0c;往上的顯示在下方&#xff0c;這樣數值不會擋住線。 首先&#xff0c;做一些模擬數據 因為起點和終點數值必須顯示&#xff0c;所以單元格&#xff0c;C2 D2 C19 D…

      淺談Vue之雙向綁定

      VUE實現雙向數據綁定的原理就是利用了 Object.defineProperty() 這個方法重新定義了對象獲取屬性值(get)和設置屬性值(set)的操作來實現的。那么Object.defineProperty究竟是該如何使用的呢&#xff1f;先看個例子 <!DOCTYPE html> <html lang"en"><h…

      【AtCoder】AGC017

      A - Biscuits dp[i][0/1]表示當前和是偶數還是奇數&#xff0c;直接轉移即可 #include <bits/stdc.h> #define fi first #define se second #define pii pair<int,int> #define mp make_pair #define pb push_back #define space putchar( ) #define enter putchar…

      SQL語法(1、安裝操作)

      1、數據庫的系統概述及安裝與基本使用 bilibili可查找安裝視頻百度了解一下 – 使用超級管理員登錄 CONN sys/change_on_install AS SYSDBA ; – 創建c##scott用戶 CREATE USER c##scott IDENTIFIED BY tiger ; – 為用戶授權 GRANT CONNECT,RESOURCE,UNLIMITED TABLESPACE…

      java 中文字符和unicode編碼值相互轉化

      java 中文字符和unicode編碼值相互轉化 https://blog.csdn.net/u011366045/article/details/79235217 版權聲明&#xff1a;本文為博主原創文章&#xff0c;未經博主允許不得轉載。 https://blog.csdn.net/u011366045/article/details/792352171、引用工具 import com.alibaba.…

      Object 及toString() 方法的重寫

      Object: 是所有的類的父類 &#xff0c;Object中所有的方法 &#xff0c; 子類都能使用 &#xff0c; 接口不是Object子類。 Person: /*將父類的equals方法 重寫* 不改變父類的源代碼 equals 比較內存地址* 比較兩個成員變量 變量值相等 返回true 不等 返回false* 重…

      SQL語法練習

      SQL語法練習https://blog.csdn.net/qq_30764991/article/details/81952197員工表建表語句: CREATE TABLE EMP ( ENAME VARCHAR2(30), EMPNO NUMBER(5), DEPTNO NUMBER(5), JOB VARCHAR2(20), HIREDATE DATE, COMM NUMBER(6,2), SAL NUMBER(6,2) ); 部門表建表語句: CREATE TA…

      第22章:MongoDB-聚合操作--聚合管道--$out

      ①$out$out&#xff1a;利用此操作可以將查詢結果輸出到指定的集合里面。②范例&#xff1a;將投影的結果輸出到集合里③④⑤⑥⑦⑧⑨⑩??????????轉載于:https://www.cnblogs.com/Lucky-stars/p/10555296.html

      SQL簡單查詢

      1、簡單查詢 使用Oracle sql developer使用前&#xff0c;必須開啟的服務&#xff1a; 查詢emp表上的數據&#xff1a; select * from emp; Null為空&#xff0c;空不代表等于沒有&#xff0c;null&#xff01;0. 重新連接后&#xff0c;注意大小寫及空格位&#xff01; 簡…

      實用小技巧(一):UIScrollView中上下左右滾動方向的判斷

      https://www.jianshu.com/p/93e8459b6dae 2017.06.01 01:13* 字數 674 閱讀 1201評論 0喜歡 12017.06.01 01:13* 字數 674 閱讀 1201評論 0喜歡 1 版本記錄 版本號 時間 V1.0 2017.05.31 前言 ios中又很多實用的小技巧&#xff0c;實現不難很實用&#xff0c;以后我會慢慢的…

      less.js

      1.變量 2.混入 3.帶參的混入 4.選擇器的繼承&#xff0c;貌似還不支持 5.嵌套規則 6.運算 7.顏色函數 8.條件語句與控制&#xff0c;貌似不支持 9.命名空間 10.注釋 11.作用域 12.字符的插入 13.轉義 14.JavaScript 的賦值轉載于:https://www.cnblogs.com/I-am-fine/archive/20…

      SQL限定查詢

      1、限定查詢與排序顯示 1.1限定查詢的認識&#xff1a; 列&#xff1a;表中有大數據的信息&#xff0c;對數據進行篩選&#xff0c;查詢到自己想要的信息。 &#xff08;數據過多顯示過慢&#xff0c;或者死機&#xff0c;在已有的樣本數據庫容器CDB轉換為PDB之中&#xff09;…

      Centos6.10源碼部署zabbix-3.2.6

      環境&#xff1a;Centos6.10 已有lnmp環境 mysql5.7 php7.2 創建zabbix數據庫 mysql> create database zabbix character set utf8 collate utf8_bin; mysql> grant all privileges on zabbix.* to zabbixlocalhost identified by zabbix; 創建zabbix用戶 shell> …

      淺談五大Python Web框架

      http://www.csdn.net/article/2011-02-17/292058 導讀&#xff1a;作者飛龍寫了一篇《淺談Python Web框架》&#xff0c;文中他介紹了幾個Python Web框架和自己對選擇框架的分析。在他看來&#xff0c;用Django來快速開發一些Web運用是很不錯的選擇。以下是文章內容&#xff1a…

      主流瀏覽器和內核及Web標準

      目前網絡市場的瀏覽器主流&#xff1a; 課時3&#xff1a;web標準 WEB標準 w3c 萬維網聯盟組織&#xff0c;制定web標準的機構。 網頁主要由三部分組成&#xff1a; 結構&#xff08;Structure&#xff09;、 表現&#xff08;Presentation&#xff09; 行為&#xff08;Beh…

      質量屬性六個常見屬性場景(《淘寶網》為例) 15

      六個最常見的系統質量屬性分別是&#xff1a;可用性&#xff08;Availability&#xff09;、可修改性&#xff08;Modifiability&#xff09;、性能&#xff08;Performance&#xff09;、安全性&#xff08;Security&#xff09;、可測試性&#xff08;Testability&#xff09…

      機器學習中的損失函數 (著重比較:hinge loss vs softmax loss)

      https://blog.csdn.net/u010976453/article/details/78488279 1. 損失函數 損失函數&#xff08;Loss function&#xff09;是用來估量你模型的預測值 f(x)f(x) 與真實值 YY 的不一致程度&#xff0c;它是一個非負實值函數&#xff0c;通常用 L(Y,f(x))L(Y,f(x)) 來表示。損失函…

      HTML入門第一和第二章

      課時4&#xff1a;HTML初識 1、英文名&#xff08;Hyper Text Markup Language&#xff09;超文本標簽語言 對網頁上的內容進行描述 課時5&#xff1a;HTML骨架 課時6&#xff1a;我的第一個頁面及其標簽簡介 課時7&#xff1a;骨架記憶法 課時8&#xff1a;什么是標簽及其分…

      mysql 指令

      // 授予用戶某些權限GRANT ALL ON *.* TO USERHOST;// 進入mysql訪問特定數據庫mysql -u user -p database_name// 查看數據表結構DESCRIBE table_name;// 加載文本數據到tableLOAD DATA LOCAL INFILE file_path INTO TABLE table_name;// UPDATE語句UPDATE table_name SET col…

      flex label 換行

      Flex中label換行有兩種情況 在AS中賦值&#xff1a; label.text"Online\r\nResources" 在mxml中賦值&#xff1a; text"OnlineResources" 在flash builder中就可以換行顯示了。左右有四種對齊方式&#xff0c;上下四種對齊方式。 也就是說mx中的label不支持…