前端基础学习(一)HTML入门

简介: 前端基础学习(一)HTML入门

前言

HTML:超文本标记语言

一、HTML总体布局解析

以谷歌首页部分源代码为例:

H T M L 就是组成网页的基本编程语言 HTML就是组成网页的基本编程语言HTML就是组成网页的基本编程语言

使用DW创建自己的第一个网页:

按快捷键F12快速查看浏览器页面上的效果

二、HTML常用标签解析

1、编写规则两个一对或者单标签

如:

<html></html>//网页属性标签(必带)
<head></head>//头标签(用于放标题title标签,style标签)
<body></body>//主标签(放网页主要内容)
<fone></fone>//操作字体属性的标签
<h1>一号标题</h1>一共有六个等级的标题标签h1~h6
<hr/>//单标签,分割线
<br/>//单标签,换行
<img/>//单标签,图片
2、标签内的属性
<html lang="en"></html>
<fone size="6" face="楷体"></fone>
<hr color="res"/>
<img src="" width=""/>

三、HTML实例(简易简历制作)

由于简历的格式比较简单,非常适合刚入门HTML的种子选手拿来练手网页源代码如下:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>我的简历</title>
</head>
<body>
  <h1 align="center">我的简历</h1>
  <hr>
  <h3 align="left">姓名:寻至善&nbsp&nbsp&nbsp&nbsp
      性别:男&nbsp&nbsp&nbsp&nbsp
    年龄:22岁
    <img src="照片/签名.jpg">
  </h3>
    <br/>
  <h2>学习经历:</h2>
  <hr color="red"/>
  
  <h2>项目经历:</h2>
  
</body>
</html>

四、HTML入门知识思维导图

五、总结

⭐️了解了HTML语言与DW相关操作

🌟知道了标签的含义,以及一些基础的标签

⭐️制作了第一个网页

🌟使用了思维导图来记忆HTML基础知识

目录
相关文章
|
3月前
|
前端开发 JavaScript
个人征信电子版无痕修改, 个人信用报告pdf修改,js+html+css即可实现【仅供学习用途】
本代码展示了一个信用知识学习系统的前端实现,包含评分计算、因素分析和建议生成功能。所有数据均为模拟生成
|
3月前
|
前端开发
个人征信PDF无痕修改软件,个人征信模板可编辑,个人征信报告p图神器【js+html+css仅供学习用途】
这是一款信用知识学习系统,旨在帮助用户了解征信基本概念、信用评分计算原理及信用行为影响。系统通过模拟数据生成信用报告,涵盖还款记录
|
5月前
|
移动开发 前端开发 安全
|
7月前
|
前端开发
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
188 1
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
|
5月前
|
前端开发 JavaScript
|
8月前
|
Dart 前端开发 架构师
【01】vs-code如何配置flutter环境-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈-供大大的学习提升
【01】vs-code如何配置flutter环境-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈-供大大的学习提升
418 26
|
8月前
|
移动开发 前端开发 搜索推荐
《前端技术基础》第01章 HTML基础【合集】
超文本标记语言(HyperText Markup Language,简称 HTML)是构建网页结构的基础标记语言。它与 CSS、JavaScript 协同,负责搭建网页“骨架”,用标签组织内容,像标题、段落、图片等元素,通过起始与结束标签(部分可单用,如`<img>`)界定层级与布局,将信息有序整合。标签含特定语义,向浏览器传达展示方式,为网页准确呈现及后续美化、交互筑牢根基。
223 25
|
JavaScript 前端开发 Java
【HTML入门】从网页搭建开始学习Java Web开发
今天开始总结学习Java Web,而学习Java Web我们应该先学习一些网页搭建基础的东西,今天我们就先从HTML开始。
【HTML入门】从网页搭建开始学习Java Web开发
|
XML 数据采集 前端开发
HTML+CSS入门学习
HTML+CSS入门学习
145 0