【2021-08-02】 HTML学习第一天

最新推荐文章于 2024-06-11 15:33:15 发布
最新推荐文章于 2024-06-11 15:33:15 发布
阅读量202 收藏
点赞数
文章标签： html5
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_52691800/article/details/119331374
版权

目录

1.什么是HTML？

2.什么是HTML5？

3.Html开发需要的环境

4.浏览器

5.HTML文档

6.编码方式

7.HTML元素&标签

8.HTML属性

9.HTML语法

10.常用标签（元素）

11.列表

12.超链接 a

13.图片

1.什么是HTML？

超文本标记语言

1. 超文本：页面内包含的内容不仅仅是文本

还可以包含图片、链接、音乐、视频等非文字元素。

2. 标记语言：不是编程语言

eg:<div>div</div>

     <p></p>

3. 后缀名

.html

.htm

axure rp 的文件后缀.rp

2.什么是HTML5？

HTML5（H5）是HTML的下一代标准

HTML产生于1990年

HTML4产生于1997年

HTML5产生于2008年正式发布

HTML5于2012年，基本形成了比较稳定的版本

3.Html开发需要的环境

vi、vim、记事本

VS Code

微软开发的 支持多系统 开源 内置了扩展程序的管理功能 使用方便 可以汉化

Sublime

但是，他的插件安装很困难

4.浏览器

Chrome\Firefox

有比较强大的代码调试工具

有一些好用的浏览器插件

作用：

1. 用于读取html文件，并将其作为网页显示

2. 用于调试代码

Httpd服务器

部署写好的html页面，来让用户访问

云服务器-安装-Apache-部署

Browser/Server

用户只需要安装一款主流浏览器，即可访问很多的服务

用户-电脑+手机-浏览器-网页-Server-数据库服务器

HTTP协议  -------超文本传输协议

URL  -------统一资源定位符

5.HTML文档

HTML5的文档类型 ----------<!DOCTYPE html>

<html></html>:HTML的根元素 用来包含HTML文档的所有元素

<head></head>:包含在head里的内容，不会显示在网页上，这里面通常放的一些配置信息，包含编码，作者，页面描述信息还有js、css的导入

6.编码方式

title ：标题

<body></body>:html文档的内容区

7.HTML元素&标签

标签和元素通常意思相同，但是严格来讲，一个元素通常又是由两个标签组成

HTML标签：一般成对出现、大小写不敏感、但是H4推荐使用小写

开始标签 内容 结束标签

eg：<div> <div>div<div>test</div></div> div的内容 </div>

HTML标签部分可以嵌套使用

1.块级元素：占空间

                  用来布局段落、列表、导航菜单等，不要把块级元素嵌套在行内元素里

2.行内元素：于其它行内元素共享一行空间

                     一般就是作为段落的一部分

3.空元素（单标签）：没有内容的元素

                                   空元素是在开始标签中结束的

                                   不建议直接使用<br>,建议加关闭符<br/>

eg：<hr/>       

      <br/>         

   <img src="" />

4.替代元素(替换元素)：把文件引入文档，并且用自身的位置来替换

img

video

audio

8.HTML属性

元素的属性一般在开始标签里------------属性由键值对组成

<div id="myDiv" class="myDivClass"></div>

######核心属性

             id：唯一标识

             class：表示当前元素是某一类的元素

             style：规定元素的行内样式

             title：描述元素的信息（光标悬浮时会显示）

9.HTML语法

1. 在html文档中不论由多少个空格都会解析为一个

2. 实体

  •  空格   &nbsp;
  •  <    &lt;
  •  >    &gt;
  •  "     &quot;
  •  '      &apos;
  •  &    &amp;

3. 注释

<!-- hello，world -->

注释的作用：一定要多写注释，方便之后自己或同事查看你的代码

10.常用标签（元素）

  1. div： 无意义的块级元素
  2. p ：段落 块级元素 浏览器会自动在p标签前后添加空行----------可以结合br使用
  3. h1-h6 ：一级标题-六级标题 浏览器会自动在标题标签前后添加空行 一般结合hr使用
  4. 文本格式化-----类似CSS样式
  • strong
  • b
  • em
  • i
  • u
  • sub
  • sup

11.列表

1.有序列表   ol    >    li

   * 序号默认从1开始 可用通过 start属性改变起始值 *

    eg：<ol start="3">

    *reversed (单值属性) 规定列表顺序为降序 *

    *type="1" 默认 1 还有 A ，a ，I ，i 四种值 *

2.无序列表    ul    >    li

  标题是圆型符号，无顺序

3.自定义列表    dl    >    dt、dd

12.超链接 a

<a href="https://baidu.com">百度一下</a>

<a href="mailto:rendc@briup.com" target="_blank">联系我</a>

绑定目标与元素的id值 实现锚点跳转

<a href="#header">返回顶部</a>

属性：

href：跳转的目的地target：_self/_blank

13.图片

<img src="" alt="">

src：图片的地址（必填项）

alt：图片地址出错时 会显示alt的内容

width 宽度

height 高度

qq_52691800
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
菜鸟HTML学习第一天总结
05-14
html常用标签、链接等
微信公众平台开发学习笔记第一天
04-25
微信 公众平台 开发学习笔记 第一天 微信 公众平台 开发学习笔记 第一天 微信 公众平台 开发学习笔记 第一天
html学习笔记第一天总结.pdf
10-11
html学习笔记第一天
前端学习第一天html部分标签的学习
07-31
学习前端的记录
html基础-第一天
05-25
该资源是我自学html第一天所敲的代码，供自己和他人学习和参考，博客地址： https://blog.csdn.net/lbqcsdn/article/details/80454290
css html 语法,HTML+CSS基本语法构造
weixin_36222664的博客
06-20 203
每一行中的一个列 图片声明 title鼠标在图片上面可以显示图片标题 from表单声明 method分享方法(一般是post) action 行为一般上传到哪标签一般输入文本一般用于显示文本框 密码框 按键type一般有几中形式text文本框 password密码框 submit提交按钮 reset重置按钮 radio单选 checked 多选id一般用于后面文件处理时的名称val...
PHP_MySQL教程-第一天
10-30
PHP_MySQL教程-第一天 本教程旨在帮助读者快速掌握 PHP 和 MySQL 的基本知识，了解如何使用这两种软件开发数据驱动的网站。通过本教程，读者将了解 PHP 和 MySQL 的基本概念、安装和配置、基本语法和应用场景等。 ...
HTML5拖放（Drag and Drop）全面指南：让网页互动起来
艾恩小灰灰的博客
06-06 801
HTML5 引入了许多令人兴奋的新特性，其中之一便是原生支持的拖放（Drag and Drop）功能，它极大地丰富了网页的交互体验，允许用户直接在页面上通过鼠标操作来移动元素。本文将深入浅出地介绍如何在你的网页中实现拖放功能，包括基本概念、API使用、事件处理以及代码示例。
HTML5 语义元素：构建更清晰、更易理解的网页结构
艾恩小灰灰的博客
06-11 300
表示页面或区域的头部信息，通常包含网站标志、导航链接或搜索表单等。
基于PHP开发的一套开源社交娱乐直播系统，包含IOS、Android和PC Web端，让你零成本拥有自己的直播平台。.zip
06-14
该资源内项目源码是个人的课程设计、毕业设计，代码都测试ok，都是运行成功后才上传资源，答辩评审平均分达到96分，放心下载使用！ ## 项目备注 1、该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的，请放心下载使用！ 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习，也适合小白学习进阶，当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行，也可在此代码基础上进行修改，以实现其他功能，也可用于毕设、课设、作业等。 下载后请首先打开README.md文件（如有），仅供学习参考, 切勿用于商业用途。 该资源内项目源码是个人的课程设计，代码都测试ok，都是运行成功后才上传资源，答辩评审平均分达到96分，放心下载使用！ ## 项目备注 1、该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的，请放心下载使用！ 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习，也适合小白学习进阶，当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行，也可在此代码基础上进行修改，以实现其他功能，也可用于毕设、课设、作业等。 下载后请首先打开README.md文件（如有），仅供学习参考, 切勿用于商业用途。
建筑结构水电欧式6套(14.5x20.2)\施工图\A型施工图-建筑-空施03.dwg
06-14
建筑结构水电欧式6套(14.5x20.2)\施工图\A型施工图-建筑-空施03.dwg
国人原创良心自制图书管理系统C语言版.zip
06-14
国人原创良心自制图书管理系统C语言版
如何通过目标规划达成企业战略.pptx
06-14
如何通过目标规划达成企业战略.pptx
Python核心编程作业.zip
最新发布
06-14
Python学习笔记，复习巩固，作业！！！
操作系统实验：模拟进程调度，包括挂起等操作，QT实现，加实验报告，外加qt实现的算法实验报告.zip
06-14
该资源内项目源码是个人的课程设计、毕业设计，代码都测试ok，都是运行成功后才上传资源，答辩评审平均分达到96分，放心下载使用！ ## 项目备注 1、该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的，请放心下载使用！ 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习，也适合小白学习进阶，当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行，也可在此代码基础上进行修改，以实现其他功能，也可用于毕设、课设、作业等。 下载后请首先打开README.md文件（如有），仅供学习参考, 切勿用于商业用途。 该资源内项目源码是个人的课程设计，代码都测试ok，都是运行成功后才上传资源，答辩评审平均分达到96分，放心下载使用！ ## 项目备注 1、该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的，请放心下载使用！ 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习，也适合小白学习进阶，当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行，也可在此代码基础上进行修改，以实现其他功能，也可用于毕设、课设、作业等。 下载后请首先打开README.md文件（如有），仅供学习参考, 切勿用于商业用途。
基本金融知识利用Matlab实现.rar
06-14
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
危化品安全管理平台解决方案.pptx
06-14
危化品安全管理平台解决方案.pptx
柔性制造企业数字化转型与智能工厂建设方案.pptx
06-14
柔性制造企业数字化转型与智能工厂建设方案.pptx
智能照明系统解决方案.pptx
06-14
智能照明系统解决方案.pptx
请推荐第一天的课程链接
06-06
好的，以下是一些可以学习Java基础语法入门的课程链接，你可以根据自己的学习习惯和实际情况选择适合自己的课程。 1. Java 基础语法教程 - 菜鸟教程 这是一份由菜鸟教程提供的Java基础语法教程，讲解了Java的基础语法、变量、数据类型、运算符、控制语句等内容，适合Java初学者进行入门学习。 链接：https://www.runoob.com/java/java-basic-syntax.html 2. Java 入门教程 - 网易云课堂 这是一份由网易云课堂提供的Java入门教程，包括Java基础语法、面向对象编程、异常处理等内容，适合Java初学者进行入门学习。该课程由浙江大学计算机学院教授李建忠主讲。 链接：https://study.163.com/course/courseMain.htm?courseId=1004570029 3. Java 基础教程 - B站狂神说 这是一份由B站up主“狂神说”制作的Java基础教程，讲解了Java的基础语法、面向对象编程、异常处理等内容，适合Java初学者进行入门学习。 链接：https://www.bilibili.com/video/BV1Kb411W7xX 需要注意的是，学习Java基础语法不仅要理解概念，还需要进行大量的练习和实践，建议在学习视频教程或教材的同时，多写一些小程序或者项目，以巩固所学知识。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值