前端基础学习(一)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基础知识

目录
相关文章
|
6天前
|
前端开发 JavaScript 算法
【CSS】前端三大件之一,如何学好?从基本用法开始吧!(八):学习transition过渡属性;本文学习property模拟、duration过渡时间指定、delay时间延迟 等多个参数
transition过渡属性 早期在Web中要实现动画效果,都是依赖于JavaScript或Flash来完成。 但在CSS3中新增加了一个新的模块transition,它可以通过一些简单的CSS事件来触发元素的外观变化, 让效果显得更加细腻。简单点说,就是通过鼠标经过、获得焦点,被点击或对元素任何改变中触发, 并平滑地以动画效果改变CSS的属性值。 在CSS中创建简单的过渡效果可以从以下几个步骤来实现: 在默认样式中声明元素的初始状态样式; 声明过渡元素最终状态样式,比如悬浮状态; 在默认样式中通过添加
60 1
|
6天前
|
前端开发 JavaScript 算法
【CSS】前端三大件之一,如何学好?从基本用法开始吧!(七):学习ransform属性;本文学习 rotate旋转、scale缩放、skew扭曲、tanslate移动、matrix矩阵 多个参数
transform变形 css3在原来的基础上新增了变形和动画相关属性,通过这些属性可以实现以前需要大段JavaScript才能实现的 功能。 CSS3的变形功能可以对HTML组件执行位移、旋转、缩放、倾斜4种几何变换,这样的变换可以控制HTML组件 呈现出丰富的外观。 借助于位移、旋转、缩放、倾斜这4种几何变换,CSS3提供了transition动画。 transition动画比较简单,只要指定HTML组件的哪些CSS属性需要使用动画效果来执行变化,并指定动画时间,就可保证动画播放。 比transitio
29 1
|
4月前
|
前端开发 JavaScript
个人征信电子版无痕修改, 个人信用报告pdf修改,js+html+css即可实现【仅供学习用途】
本代码展示了一个信用知识学习系统的前端实现,包含评分计算、因素分析和建议生成功能。所有数据均为模拟生成
|
4月前
|
前端开发
个人征信PDF无痕修改软件,个人征信模板可编辑,个人征信报告p图神器【js+html+css仅供学习用途】
这是一款信用知识学习系统,旨在帮助用户了解征信基本概念、信用评分计算原理及信用行为影响。系统通过模拟数据生成信用报告,涵盖还款记录
|
6月前
|
移动开发 前端开发 安全
|
8月前
|
前端开发
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
213 1
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
|
6月前
|
前端开发
|
6月前
|
前端开发 JavaScript
|
JavaScript 前端开发 Java
【HTML入门】从网页搭建开始学习Java Web开发
今天开始总结学习Java Web,而学习Java Web我们应该先学习一些网页搭建基础的东西,今天我们就先从HTML开始。
【HTML入门】从网页搭建开始学习Java Web开发
|
XML 数据采集 前端开发
HTML+CSS入门学习
HTML+CSS入门学习
146 0

热门文章

最新文章