《HTML入门笔记1》-外链论坛 - Powered by Discuz! Archiver

4lqedz 发表于 2024-6-30 00:00:11

《HTML入门笔记1》

<h2 style="color: black; text-align: left; margin-bottom: 10px;"><span style="color: black;">1、</span>HTML是什么？</h2>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML语言简介</p>HTML 的全名是“超文本标记语言”（HyperText Markup Language），上个世纪90年代由<span style="color: black;">理学</span>学家李爵士（Tim Berners-Lee）发明。它的最大特点<span style="color: black;">便是</span>支持超链接，点击链接就<span style="color: black;">能够</span><span style="color: black;">转</span>到其他网页，从而构<span style="color: black;">成为了</span><span style="color: black;">全部</span>互联网。<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">网页及HTML概述</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML 是网页<span style="color: black;">运用</span>的语言，定义了网页的结构和内容。浏览器<span style="color: black;">拜访</span>网站，其实<span style="color: black;">便是</span>从服务器下载 HTML 代码，<span style="color: black;">而后</span>渲染出网页。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">浏览器的网页<span style="color: black;">研发</span>，<span style="color: black;">触及</span>三种技术：HTML、CSS 和 JavaScript</p>HTML 语言定义网页的结构和内容CSS 样式表定义网页的样式JavaScript 语言定义网页与用户的互动<span style="color: black;">行径</span>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">（HTML 语言是网页<span style="color: black;">研发</span>的<span style="color: black;">基本</span>，CSS 和 JavaScript 都是基于 HTML <span style="color: black;">才可</span>生效，即使<span style="color: black;">无</span>这两者，HTML 本身<span style="color: black;">亦</span>能<span style="color: black;">运用</span>）</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">其实网页的 HTML 代码<span style="color: black;">便是</span>由许许多多<span style="color: black;">区别</span>的标签（tag）<span style="color: black;">形成</span>。学习 HTML 语言，<span style="color: black;">便是</span>学习<span style="color: black;">各样</span>标签的用法。</p>
<h2 style="color: black; text-align: left; margin-bottom: 10px;"><span style="color: black;">2、</span>HTML起手应该怎么写</h2>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic3.zhimg.com/80/v2-92bc09b582124b82f157e56c0dcebc86_720w.webp" style="width: 50%; margin-bottom: 20px;"></div><span style="color: black;">通知</span>文档类型（告诉浏览器，我要准备写HTML啦！）<div style="color: black; text-align: left; margin-bottom: 10px;"><!DOCTYPE html></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">2. html标签，lang=en（lang为语言，en可改为zh-CN中文）</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><html lang="en"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">3. head标签，里面写的内容基本都是看不见的声明内容</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><head>
...
</head></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">4. 文件的字符编码（<span style="color: black;">通常</span><span style="color: black;">状况</span>下<span style="color: black;">没</span>需改变，此格式支持<span style="color: black;">更加多</span>语言）</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><meta charset="UTF-8"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">5. 禁用页面缩放</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><meta http-equiv="X-UA-Compatible" content="IE=edge"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">6. 告诉IE<span style="color: black;">运用</span>最新内核</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><meta name="viewport" content="width=device-width, initial-scale=1.0"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">7. 此文档的标题为Document</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><span style="color: black;"><</span><span style="color: black;">title</span><span style="color: black;">></span>Document<span style="color: black;"></</span><span style="color: black;">title</span><span style="color: black;">></span></div>
<h2 style="color: black; text-align: left; margin-bottom: 10px;"><span style="color: black;">3、</span>常用的章节标签</h2>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">标题：h1~h6</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">文案</span>标题：（以此类推）<span style="color: black;">通常</span><span style="color: black;">文案</span>，章节都有标题</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><h1> ... </h1> //一级标题</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><h2> ... </h2> //二级标题</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">章节：<section> ... </section></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><section>标签<span style="color: black;">暗示</span>一个含有主体的独立部分，<span style="color: black;">一般</span>用在文档里面<span style="color: black;">暗示</span>一个章节，<span style="color: black;">例如</span><artical>标签里<span style="color: black;">能够</span><span style="color: black;">包括</span>多个<section>标签，<section>总是多个<span style="color: black;">一块</span><span style="color: black;">运用</span>。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">段落：<p> ... </p></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">段落文本<span style="color: black;">运用</span>的标签</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">头部：<header> ... </header></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">头部标签<span style="color: black;">亦</span>叫作页眉标签，<header>标签<span style="color: black;">能够</span>适用在多个场景，既<span style="color: black;">能够</span><span style="color: black;">暗示</span><span style="color: black;">全部</span>网页的头部，<span style="color: black;">亦</span><span style="color: black;">能够</span><span style="color: black;">暗示</span>一个<span style="color: black;">文案</span>或一个区块的头部。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">脚部：<footer> ... </footer></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><footer>标签<span style="color: black;">暗示</span>网页、<span style="color: black;">文案</span>或章节的尾部，<span style="color: black;">倘若</span>用于整张网页的尾部，就<span style="color: black;">叫作</span>为页尾；<span style="color: black;">通常</span><span style="color: black;">包括</span>版权信息或其他<span style="color: black;">关联</span>信息。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">重点</span>内容：<main> ... </main></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><main>标签<span style="color: black;">通常</span><span style="color: black;">暗示</span>页面的主题内容，<span style="color: black;">通常</span>一个页面内<span style="color: black;">仅有</span>一个<main>标签</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">重视</span>：<main>标签是顶层标签，<span style="color: black;">不可</span><span style="color: black;">安置</span>在<artical>,<header>,<footer>,</p>

jxwysz 发表于 2024-8-26 06:44:06

你的话语如春风拂面，温暖了我的心房，真的很感谢。

流星的美 发表于 2024-9-5 08:21:55

顶楼主，说得太好了！

j8typz 发表于 2024-9-29 23:13:45

回顾历史，我们不难发现：无数先辈用鲜血和生命铺就了中华民族复兴的康庄大道。

nqkk58 发表于 2024-10-10 13:57:05

楼主果然英明！不得不赞美你一下！

页: [1]

外链论坛's Archiver

《HTML入门笔记1》