HTML基础---0

最新推荐文章于 2023-05-17 19:00:57 发布
最新推荐文章于 2023-05-17 19:00:57 发布
阅读量432 收藏
点赞数
分类专栏： HTML 文章标签： HTML简介 HTML 编辑器 HTML 标签
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yulong__li/article/details/88088940
版权

目录

HTML 简介

什么是 HTML？

HTML 标签

HTML 文档 = 网页

例子解释

HTML 编辑器

使用 Notepad 或 TextEdit 来编写 HTML

步骤一：启动记事本

步骤二：用记事本来编辑 HTML

步骤三：保存 HTML

步骤四：在浏览器中运行这个 HTML 文件

基本的 HTML 标签 - 四个实例

HTML 标题

实例

HTML 段落

实例

HTML 链接

实例

HTML 图像

实例

HTML 简介

什么是 HTML？

HTML 是用来描述网页的一种语言。

  • HTML 指的是超文本标记语言 (Hyper Text Markup Language)
  • HTML 不是一种编程语言，而是一种标记语言 (markup language)
  • 标记语言是一套标记标签 (markup tag)
  • HTML 使用标记标签来描述网页

HTML 标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

  • HTML 标签是由尖括号包围的关键词，比如 <html>
  • HTML 标签通常是成对出现的，比如 <b> 和 </b>
  • 标签对中的第一个标签是开始标签，第二个标签是结束标签
  • 开始和结束标签也被称为开放标签和闭合标签

HTML 文档 = 网页

  • HTML 文档描述网页
  • HTML 文档包含 HTML 标签和纯文本
  • HTML 文档也被称为网页

Web 浏览器的作用是读取 HTML 文档，并以网页的形式显示出它们。浏览器不会显示 HTML 标签，而是使用标签来解释页面的内容：

<html>
<body>

<h1>我的第一个标题</h1>

<p>我的第一个段落。</p>

</body>
</html>

例子解释

  • <html> 与 </html> 之间的文本描述网页
  • <body> 与 </body> 之间的文本是可见的页面内容
  • <h1> 与 </h1> 之间的文本被显示为标题
  • <p> 与 </p> 之间的文本被显示为段落

HTML 编辑器

使用 Notepad 或 TextEdit 来编写 HTML

可以使用专业的 HTML 编辑器来编辑 HTML：

  • Adobe Dreamweaver
  • Microsoft Expression Web
  • CoffeeCup HTML Editor

不过，我们同时推荐使用文本编辑器来学习 HTML，比如 Notepad (PC) 或 TextEdit (Mac)。我们相信，使用一款简单的文本编辑器是学习 HTML 的好方法。

通过记事本，依照以下四步来创建一张网页。

步骤一：启动记事本

如何启动记事本：

开始
    所有程序
        附件
            记事本

步骤二：用记事本来编辑 HTML

在记事本中键入 HTML 代码：

步骤三：保存 HTML

在记事本的文件菜单选择“另存为”。

当您保存 HTML 文件时，既可以使用 .htm 也可以使用 .html 扩展名。两者没有区别，完全根据您的喜好。

在一个容易记忆的文件夹中保存这个文件，比如 w3school。

步骤四：在浏览器中运行这个 HTML 文件

启动您的浏览器，然后选择“文件”菜单的“打开文件”命令，或者直接在文件夹中双击您的 HTML 文件。

结果应该类似这样：

基本的 HTML 标签 - 四个实例

本章通过实例向您演示最常用的 HTML 标签。

HTML 标题

HTML 标题（Heading）是通过 <h1> - <h6> 等标签进行定义的。

实例

<!DOCTY　HTＭL>
<html>

<body>

<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>

<p>请仅仅把标题标签用于标题文本。不要仅仅为了产生粗体文本而使用它们。请使用其它标签或 CSS 代替。</p>

</body>
</html>

 

HTML 段落

HTML 段落是通过 <p> 标签进行定义的。

实例

<!DOCTY　HTＭL>
<html>

<body>

<p>这是段落。</p>
<p>这是段落。</p>
<p>这是段落。</p>

<p>段落元素由 p 标签定义。</p> 

</body>
</html>

HTML 链接

HTML 链接是通过 <a> 标签进行定义的。

实例

<!DOCTY　HTＭL>
<html>

<body>

<a href="https://blog.csdn.net/yulong__li">这是我的博客</a>

</body>
</html>

注释：在 href 属性中指定链接的地址。

HTML 图像

HTML 图像是通过 <img> 标签进行定义的。

实例

<!DOCTY　HTＭL>
<html>

<body>

<img src="D:\360downloads\流浪地球.jpg" width="300" height="120" />

</body>
</html>

注释：图像的名称和尺寸是以属性的形式提供的。

D:\360downloads\流浪地球.jpg 为图片地址

神化我
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
HTML 0零基础
YCC888的博客
11-14 1051
 HTML 一、HTML简介：   1．HTML（Hyper Text Markup Language），超文本标记性语言。   2．1997年元月，W3C组织（World Wide Web Consorium）的HTML Working Group开发了HTML 3.2。   3．现在使用的HTML版本为HTML 4.0。     XHTML 二、HTML的编写方法：   1．利用记...
零基础html入门（1）
yzy0223的博客
04-28 443
计算机 分为硬件和软件。 硬件：电脑、手机。 软件：C/S开发：C#、C++、C 等。 B/S开发：Java、PHP、Python，等等。 软件测试：测试软件。 网络：维护等。 1.html简介 超文本 标记 语言 后缀名：xxx.html/xxx.htm 写网页的编辑器：DW、txt、Hbuilder、等等。 调试网页的方法：浏览器调试： 谷歌、火狐、IE、欧朋、safari浏览器 2.html...
零基础初学HTML
chuxin_2017的博客
02-25 735
学html+css+js，易上手，无需编译，无需搭环境，无需配runtime，一个简单IDE+一个浏览器就搞定，易出成效，玩法多样，不受平台限制，相比其他语言坑比较少，入门容易，是广大闲暇人士茶余饭后必备之选 制作网站是一件充满乐趣的事情，制作成功，会感到很满足。 不需要任何编程基础，参考如下链接一两个小时就可以制成一个网站，会让你更有兴趣学习html 备注：只要具备浏览器和文本编辑器（比如not...
零基础HTML学习历程 （一） 初识HTML
HJ
10-27 3356
首先我是拿着这本书开始我的HTML入门之旅的（如下图） 对这本书的评价在网上都有，我就不多说了哈。 先给HTML下个含义：HTML是超文本标记语言（HyperText Markup Language）的缩写，用来建立网页的结构。与它形影不离的一个好兄弟是css（这个同时在另外的文章里面专门会讲），他们两个好兄弟一起工作，是我么用来创建网页的语言。 初次见面
HTML入门教程：快速了解HTML ，适合零基础（有基础的勿入）
qq_63389054的博客
04-27 2389
HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。 文章目录 前言 一、HTML基本框架及快捷键生成基础框架 1.HTML基本框架介绍 2.快捷键生成基础框架 二、内联元素和块级元素 1.内联元素 2.块级元素 三...
前端基础---html
09-21
使用于刚开始学习前端的小白，我的手写笔记！欢迎大家来监督我的学习，争取在十二月份时给我闺蜜做一个礼物。。。哈哈哈哈。。。
javaWeb自学-html基础
最新发布
03-09
javaWeb自学-html基础
前端基础-html 精讲 代码展示
04-12
前端基础-------html 精讲 代码展示 对文章html基础中的代码进行执行,得到输出样例,可以更好的配合文章------html精讲促进读者理解.
html-css.pdf
09-26
html学习资料，基于python和selenium，本人觉得不错，与大家分享一下，希望大家多多指导，共同进步。有基础看更好哦！
HTML - DIV+CSS
10-17
HTML - DIV+CSS 课件，DIV标签介绍 CSS基础 MARGIN,PADDING介绍 BORDER介绍 FLOAT介绍 综合练习
浏览器看网页HTML元素时, HTML 中 常常出现 ==$0 字符，表示什么？
xiaoyu_wu的博客
10-06 9486
==$0 表示当前你选中的元素，在下方控制台(Console)中输入 $0时，可以打印出选中的那一行 html 代码。 如以下截图： $0-$4–依次返回五个最近你在元素面板选择过的DOM元素的历史记录，$0是最新的记录，以此类推。 ...
$('')[0]
weixin_33767813的博客
11-10 2340
2019独角兽企业重金招聘Python工程师标准>>> ...
关于 '/0'
朵猫猫
03-07 1万+
'/0'代表ASCII码为0的字符，从ASCII码表中可知，ASCII码为0的字符不是一个可以显示的字符，而是一个“空操作符”，即它什么也不做。用它来作为字符串结束标志不会产生附加的操作或增加有效字符，只起一个供辨别的标志。
HTML零基础快速入门（详细教程）
小杨的博客
05-17 4140
HTML 是用来描述网页的一种语言，即：HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本，添加图片，创建链接、输入表单、框架和表格等等，并可将之存为文本文件，浏览器可读取和显示。
HTML零基础入门教程（详细）
热门推荐
ZONGXP的博客
10-22 21万+
HTML 是用来描述网页的一种语言。HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本，添加图片，创建链接、输入表单、框架和表格等等，并可将之存为文本文件，浏览器即可读取和显示。 HTML 指的是超文本标记语言:HyperTextMarkupL...
html中的==$0是什么意思
Fighting社火底子
07-25 3万+
  DevTools控制台支持一些变量和函数来选择DOM元素： $()–document.querySelector()的简写，返回第一个和css选择器匹配的元素。例如$(‘div’)返回这个页面中第一个div元素 $$()–document.querySelectorAll()的简写，返回一个和css选择器匹配的元素数组。 $0-$4–依次返回五个最近你在元素面板选择过的DOM元素的历史...
numpy数组中冒号[:,:,0]与[...,0]的区别
deeplearningbo的博客
04-13 1万+
今天在看光流法将稠密光流图结果转为bgr可视化图的代码时，遇到了上述情况，写此博客便于理解清晰。 如有错误，敬请指正。 先随机产生一个[3,4,5]的numpy数组。则该x维度是3，shape是（3,4,5），总共包含60个元素。 x[:,:,0] 意思是对数组x切片，可以想象成一个正方体数据，每次切下一个面的数据。第二维取0则得出来[3,4]大小的数组，即 可以验证： ...
'/0'和"/0"的区别
SHIMMER8711的专栏
10-15 5677
nullah (大山.mumu) 等　级： 结帖率：82.61% 楼主发表于：2008-11-14 09:48:35在遍历字符串的时候 C/C++ code char *a = "abcde";while(*a != /0){}while(a != "/0")//这样要出界 为什么
vue基础-MVVM设计模式
04-30
1. 视图层(View)：负责展示数据，通常是 HTML 模板。 2. 模型层(Model)：负责存储数据，通常是 JavaScript 对象。 3. 视图模型层(ViewModel)：负责处理视图与模型之间的交互，它是一个纯粹的 JavaScript 对象，负责...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值