HTML5教程从《HTML+CSS基础课程》学习笔记中的技巧
yund56 2025-04-26 20:23 28 浏览
本文为兄弟连云课堂《HTML+CSS基础课程》学习笔记 订阅走一波。
第一章：Html简介
1. Html、CSS和Javascript的关系
1. HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。
2. CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。
3. JavaScript是用来实现网页上的特效效果。如：鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻（新闻图片）的轮换。可以这么理解，有动画的，有交互的一般都是用JavaScript来实现的。
2. 标签初认识
1. 语法
标签由英文尖括号<和>括起来，html中的标签一般都是成对出现的，分开始标签和结束标签。标签与标签之间是可以嵌套的，但先后顺序必须保持一致，如：<div>里嵌套<p>，那么</p>必须放在</div>的前面。此外，HTML标签不区分大小写，<h1>和<H1>是一样的，但建议小写，因为大部分程序员都以小写为准。
2. html标签
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>认识html标签</title>
</head>
<body>
<h1>勇气</h1>
<p>三年级时，我还是一个胆小如鼠的小女孩，上课从来不敢回答老师提出的问题，生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
<p>到了三年级下学期时，我们班上了一节公开课，老师提出了一个很简单的问题，班里很多同学都举手了，甚至成绩比我差很多的，也举手了，还说着："我来，我来。"我环顾了四周，就我没有举手。</p>
<img src="http://img.mukewang.com/52b4113500018cf102000200.jpg" >
</body>
</html>1234567891011121312345678910111213
这个网页由一些html标签组成：
“勇气”是网页内容文章的标题，<h1></h1>就是标题标签，它在网页上的代码写成<h1>勇气</h1>。
“三年级时…我也没勇气参加。” 是网页中文章的段落，<p></p>是段落标签。它在网页上的代码写成<p>三年级时...我也没勇气参加。</p>
网页上那张小女生的图片，由img标签来完成的，它在网页上的代码写成<img src="1.jpg"。总结一下，可以这么说，网页中每一个内容在浏览器中的显示，都要存放到各种标签中。
<head>标签：文档的头部描述了文档的各种属性和信息，包括文档的标题等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。
<title>标签：在<title>和</title>标签之间的文字内容是网页的标题信息，它会出现在浏览器的标题栏中。网页的title标签用于告诉用户和搜索引擎这个网页的主要内容是什么，搜索引擎可以通过网页标题，迅速的判断出网页的主题。每个网页的内容都是不同的，每个网页都应该有一个独一无二的title。
3. html文本基本结构
一个HTML文件是有自己固定的结构的。
<html>
<head>...</head>
<body>...</body>
</html>12341234
代码讲解：
1.<html></html>称为根标签，所有的网页标签都在<html></html>中。
2.<head> 标签用于定义文档的头部，它是所有头部元素的容器。头部元素有<title>、<script>、<style>、<link>、 <meta>等标签。
3.在<body>和</body>标签之间的内容是网页的主要内容，如<h1>、<p>、<a>、<img>等网页内容标签，在这里的标签中的内容会在浏览器中显示出来。
4.HTML的代码注释
代码注释的作用是帮助程序员标注代码的用途，过一段时间后再看你所编写的代码，就能很快想起这段代码的用途。代码注释不仅方便程序员自己回忆起以前代码的用途，还可以帮助其他程序员很快的读懂你的程序的功能，方便多人合作开发网页代码。语法：<!--注释文字 -->
- 上一篇：让 HTML5 来为你定位
- 下一篇：HTML5前景展望
相关推荐
- 如何在Office 中编辑 PDF?附详细化步骤
-
PDF很受欢迎，因为它能在不同的设备和操作系统上仍然保持原有格式。但是，这也意味着直接更改PDF文件比其他格式更难更复杂。值得庆幸的是，Microsoftoffice和UPDF帮你解决这一难题。一...
- 我的 Windows 装机必备软件清单
-
今天给大家分享下我的装机必备软件，都是用了好多年的软件神器。靠谱、好用、无广告，Windows电脑必备软件，收藏这一篇就够了！01.浏览器王者：Chromehttps://www.google.c...
- Docnet Core 是一个轻量级、高性能的 .NET PDF 操作库
-
DocnetCore介绍DocnetCore是一个轻量级、高性能的.NETPDF操作库，依托于PDFium渲染引擎，提供强大的PDF文档解析、渲染、操作等功能。它完全支持.NET...
- 分享三款好用的PDF编辑软件，轻松处理PDF
-
作为一名需要经常和PDF文件打交道的工作者，我来分享一下几款好用的PDF编辑软件，并详细分析了它们的优缺点，希望能帮你找到合适的工具。1.AdobeAcrobatDC作为PDF格式的发明者，Ado...
- PDF文档创建工具软件:novaPDF OEM 11.9 Build 432 for Windows
-
novaPDFOEM是一款实用高效的软件，从头开始设计，让您尽可能轻松地在应用程序中添加PDF打印功能。换句话说，这个实用程序是专门为应用程序开发人员设计的，可以直接在程序安装程序中集成为PDF打印...
- 线性表顺序存储结构求集合的并，交，补，差(源代码附上 超详细)
-
一：算法分析1）用数组A，B，C，E表示集合。假定A={1,3，4，5，6，7，9，10}, B={2，,3，4，7，8，10},E={1,2，3，4，5，6，7，8，9，10}, 输入数组A...
- 分享一套SpringBoot开发博客系统源码，包含完整开发文档和视频
-
基本信息项目名称：eblog摘要：eblog是一个基于Springboot2.1.2开发的博客学习项目，为了让项目融合更多的知识点，达到学习目的，编写了详细的从0到1开发文档。主要学习包括：自定义Fr...
- 通达信指标合集〔源码齐全〕
-
很多朋友问到我哪款指标好用，这里我说一下，之所以有很多不同的指标是因为我们在针对不同的盘面情况的时候使用的指标是不同的，我给到的指标一般来讲就目前的环境来讲都是比较适合的，今天我就把我平时自己常用的指...
- 巅峰对决!Spring Boot VS .NET 6
-
SpringBoot和ASP.NETCore都是企业中流行的Web框架,对于喜欢C#的人会使用ASP.NETCore,而对于Java或Kotlin等基于JVM的语...
- 在asp.net core 中控制访问权限的方法
-
Intro#由于项目需要，需要在基于asp.netmvc的Web项目框架中做权限的控制，于是才有了这个权限控制组件，最初只是支持netframework，后来dotnetcore2.0...
- ASP.NET是否无生存之地?
-
ASP.NET，这个已经很久的技术，总觉得已经被时代淘汰，我们公司是一个10人小公司，几个十年十五年的项目还是用ASP.NET开发的。这两年由于客户的需求变化，我们公司也顺势开始对这些项目重新开发，改...
- Spring Boot + Vue.js 实现前后端分离(附源码)
-
作者：梁小生0101链接：juejin.im/post/5c622fb5e51d457f9f2c2381SpringBoot+Vue.js前后端涉及基本概念介绍，搭建记录，本文会列举出用到环...
- ASP.NET Core 中的 Mapster 使用入门教程
-
在本文中，我们将学习如何在ASP.NETCore应用程序中使用Mapster。首先，我们将了解Mapster是什么以及如何将其安装到.NETCore应用程序中。然后，我们将在使用...
- Asp.net常用方法及request和response-a
-
asp.net教程asp.net常用方法:1、Request.UrlReferrer请求的来源，可以根据这个判断从百度搜的哪个关键词、防下载盗链、防图片盗链，可以伪造(比如迅雷)。(使用全局一般处理...
- ASP.NET Core使用功能开关控制路由访问
-
前言在前面的文章，我们介绍了使用Middleware有条件地允许访问路由（《ASP.NETCore使用Middleware有条件地允许访问路由》）。而对于一些试验性的功能，我们并不希望用密码去控制是...
- 一周热门
- 最近发表
- 标签列表
-
- filter函数js (37)
- filter函数excel用不了 (73)
- 商城开发 (40)
- 影视网站免费源码最新版 (57)
- 影视资源api接口 (46)
- 网站留言板代码大全 (56)
- java版软件下载 (52)
- java教材电子课本下载 (48)
- 0基础编程从什么开始学 (50)
- java是用来干嘛的 (51)
- it入门应该学什么 (55)
- java线上课程 (55)
- 学java的软件叫什么软件 (38)
- 程序开发软件有哪些 (53)
- 软件培训 (59)
- 机器人编程代码大全 (50)
- 少儿编程教程免费 (45)
- 新代系统编程教学 (61)
- 共创世界编程网站 (38)
- 亲测源码 (36)
- 三角函数积分公式表 (35)
- 函数的表示方法 (34)
- 表格乘法的公式怎么设置 (34)
- sumif函数的例子 (34)
- 图片素材 (36)