html固定dl高度_HTML入门笔记1
生活随笔
收集整理的這篇文章主要介紹了
html固定dl高度_HTML入门笔记1
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
HTML概述：HTML 的全名是“超文本標記語言”（HyperText Markup Language），它是網頁使用的語言，定義了網頁的結構和內容。瀏覽器訪問網站，其實就是從服務器下載 HTML 代碼，然后渲染出網頁。
1.HTML之父
李爵士(Tim Berners-Lee)- 李爵士發明了WWW、HTML、HTTP和URL。
- 李爵士是萬維網的開創者，他寫了世界上第一個網頁瀏覽器(WorldWideWeb)和第一個網頁服務器(httpd)，同時也創建了世界上第一個網站“http://info.cern.ch/”，該網站于1991年8月6日運行，它解釋了萬維網是什么，并教會我們該如何使用網頁瀏覽器和如何建立一個網頁服務器。
2.HTML起手式
快捷鍵：感嘆號 ! + Tab鍵<!DOCTYPE html> //文檔類型為HTML <html lang="zh-CN"> //網頁語言為簡體中文<head><meta charset="UTF-8" /> //字符編碼為UTF-8<meta name="viewport" content="width=device-width, initial-scale=1.0" />//禁止縮放，兼容手機<title>我的網頁</title> //網頁標題</head><body>Hello World! //網頁內容</body> </html>3.章節標簽
表示文章/書的層級- 標題 h1~h6：h1~h6標題級數依次遞減，h1級別為最高
- 章節 section：<section>章節元素表示一個包含在HTML文檔中的獨立部分，一般來說會有包含一個標題。與<article>比較而言，<section>更適用于組織頁面使其按功能（比如迷你地圖、一組文章標題和摘要）分塊。一般的最佳用法是：以標題作為開頭；也可以把一篇<article>分成若干部分并分別置于不同的<section>中，也可以把一個區段<section>分成若干部分并分別置于不同的<article>中，取決于上下文。
- 段落 p：<p>元素表示文本的一個段落，也被稱為HTML段落元素，該元素通常表現為一整塊與相鄰文本分離的文本，或以垂直的空白隔離或以首行縮進。此外，<p> 是塊級元素（塊級元素中可以包含塊級元素和行內元素，總是從新的一行開始，高度、寬度都是可控的，寬度在沒有設置時，默認為100%）。
- article 文章：<article>文章元素表示文檔、頁面、應用或網站中的獨立結構，其意在成為可獨立分配的或可復用的結構，如在發布中，它可能是論壇帖子、雜志或新聞文章、博客、用戶提交的評論、交互式組件，或者其他獨立的內容項目。??
- header 頭部：<header>頭部元素用于展示介紹性內容，通常包含一組介紹性的或是輔助導航的實用元素。它可能包含一些標題元素，但也可能包含其他元素，比如 Logo、搜索框、作者名稱等等。
- footer 腳部 ：定義了頁腳，通常包含版權或法律聲明，有時還包含一些鏈接。在部分的情況下，頁腳可能包含切片內容的發布日期，許可證信息等<article>，<section>，<aside>，和<nav>可以有自己的<footer>。盡管有其名稱，但頁腳不一定位于頁面或節的末尾。（©；版權聲明符號）
- main 主要內容：存放每個頁面獨有的內容。每個頁面上只能用一次<main>，且直接位于<body>中。最好不要把它嵌套進其它元素。
- aside 旁支內容：包含一些間接信息（術語條目、作者簡介、相關鏈接，等等）。
- div 劃分：<div>元素(或HTML 文檔分區元素) 是一個通用型的流內容容器，在不使用CSS的情況下，其對內容或布局沒有任何影響。
代碼示例
<body><header>頂部內容</header><div><main><h1>HTML入門學習</h1><section><h2>第一章</h2><p>應該如何學習HTML，首先要了解章節標簽和內容標簽，然后要熟記并反復練習。</p><section><h3>第一節</h3><p>HTML中的章節標簽有“標題h1~h6,章節section，段落p，文章article，頭部header，腳部footer,主要內容main，旁支內容aside以及劃分div"。</p></section></section></main><aside>補充知識點：李爵士被稱為互聯網之父</aside></div><footer>©版權聲明</footer></body>效果對照
4.全局屬性
所有標簽都有的屬性- class ：以空格分隔的元素的類名列表
- contenteditable：可以讓所有元素可編輯。<div class="middle bordered" contenteditable>
- hidden：隱藏，比display：block優先級高
- id: 全局唯一屬性，謹慎使用，不會報錯
- style：html 的屬性，不是 css 的樣式，也可以通過 js 設置，js 會覆蓋 html 的 style（js 優先級最高，js>html>css）。
- tabindex：控制Tab鍵訪問的順序。（0 是最后訪問，-1 是不允許訪問，優先級1>2>.....）
- title: 包含了表示咨詢信息文本，和它屬于的元素相關。這個信息通常存在，但絕不必要，作為提示信息展示給用戶。可用于溢出省略。
5.常用的內容標簽
清除樣式(寫在開頭的head之間)
<style>*{margin: 0;padding:0;box-sizing:border-box;}*::after, *::before{box-sizing:border-box;}h1,h2,h3,h4,h5,h6{font-weight:normal;}a{color:inherit;text-decoration:none;}ul,ol{list-style:none;}table{border-collapse:collapse; border-spacing:0; }</style>- ol+li: 有序列表，ol不能含有除li外的任何子元素
- ul+li: 無序列表
- dl+dt+dd: dl是描述的列表，dt是描述的對象，dd是描述的內容。
- pre：顯示文本中的空白符
- code: 包裹的字體等寬，可以與pre搭配寫代碼
- hr: 分割線
- br: 換行
- a: 超鏈接 target="_blank" 用于打開新窗口（常用于國內）
- em: 強調，默認樣式為斜體（語氣）
- strong: 重要，默認樣式為加粗（本身內容）
- quote: 內聯引用
- blockquote: 塊級引用
總結
以上是生活随笔為你收集整理的html固定dl高度_HTML入门笔记1的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 并发执行变成串行_大白话Java并发面试
- 下一篇： 困难时拉你一把的图片_2019早上好表情