Hx Builder开发自己的第一个html页面

最新推荐文章于 2024-01-19 11:11:32 发布

weixin_45658815

最新推荐文章于 2024-01-19 11:11:32 发布

阅读量3.1k

点赞数 7

分类专栏：前端学习文章标签： html 前端 javascript

本文链接：https://blog.csdn.net/weixin_45658815/article/details/128443863

版权

前端学习专栏收录该内容

2 篇文章 0 订阅

订阅专栏

html小白入门

开发环境
创建自己的第一个html文件
常见的html标签

开发环境

比较常用的html开发软件，hx builder
hx builderhx builder
在这里插入图片描述

下载地址：https://dcloud.io/hbuilderx.html
安装：选择合适的解压路径（推荐D盘），直接解压即可。
在这里插入图片描述

创建自己的第一个html文件

双击打开hx builder，根据下面的步骤新建一个属于自己的html工程。
1、在这里插入图片描述

2、
在这里插入图片描述

3、在这里插入图片描述

4、在这里插入图片描述
5、

6、在这里插入图片描述

超文本标记语言（外国语简称：HTML）标记标签通常被称为HTML标签，HTML标签是HTML语言中最基本的单位，HTML标签是HTML（标准通用标记语言下的一个应用）最重要的组成部分。
HTML标签的大小写无关的，例如“主体”跟表示的意思是一样的，推荐使用小写。
7、配置html浏览器
在这里插入图片描述

8、页面上的内容写在主体标签body之间，该标签中的任何东西都会显示到浏览器中，但为了标准以及样式的设置，一般都需要存放在别的标签中，如代码中的文字放在段落标签p中,这样后续就可以为该文字设置颜色和字体大小等。当然第一种方式也不会报错。hx builder的缺点之一就是不会报错，即使标签书写不规范（这里推荐idea，前端到后端一个软件走天下）
在这里插入图片描述

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		这是我的第一个html页面
		<p>这是我的第一个html页面</p>
	</body>
</html>

9、运行
在这里插入图片描述

10、运行结果
在这里插入图片描述

常见的html标签

标题标签

h1~h6，独占一行，块元素

   <h1>一级标题</h1>
   <h2>二级标题</h2> 
   <h3>三级标题</h3>
   <h4>四级标题</h4>
   <h5>五级标题</h5>
   <h6>六级标题</h6>

段落标签 p

独占一行，块元素

<p></p>

换行标签br

独占一行，块元素

<br/>

div标签

独占一行，块元素，用于布局

<div></div>