【HTML】基础知识

已于 2023-08-22 20:58:50 修改
阅读量150 收藏
点赞数
分类专栏： html 文章标签： html
于 2021-03-21 22:23:20 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/MY9_19/article/details/115057676
版权

【HTML】基础知识

1、简介

  • B/S结构：

    浏览器/服务器

    客户端向服务器端发送一条请求(request)，服务器接收到了请求响应客户端(respone)同意(200)/拒绝(404)

  • 前端开发：

    去按照客户给的需求，自己或者客户设计的UI(美工)页面，前端工程师开发页面结构代码(静态代码)，然后通过后台开发(java程序员)把静态页面变成动态页面(围绕crud增删查改)。

  • 什么是HTML：

    HyperText Markup Language 超文本标记语言,https(超文本传输协议)

    • 文件后缀： .html或者.htm
    • HTML不区分大小写，建议小写
    • HTML是由浏览器解析执行，由上往下，由左往右
    • 在java中是万物皆对象，在html里是万物皆盒子
  • 一个网页页面的组成结构：
    • 一个页面组成的代码一定是由头部和身体组成
    • 一个页面可以分为三个部分的内容组成：骨架(html)，整容(css)，行为(javaScript)
  • 在标记语言中的注释
    <!-- 
	在标记语言中的注释
	既可以当做单行注释，也可以当做多行注释
-->
  • 什么是标签

    • 标签是由尖括号包围的关键词 ,标签也叫做标记

    • 标签分为单标签和双标签俩种

      双标签封闭类型标记 内容
      单标签非封闭类型标记空标记

2、第一个html页面

  • 一个页面组成的基本代码
    • 因为html也是一个标记语言，所以第一行一定要有身份表明
    • 页面结构的最外层是由html标签架构
    • 在html标签中使用head和body标签构成
    <!DOCTYPE html> 	<!-- 第一行的含义就是表示当前是一个html文件 -->

<html>			    <!-- html相当于一个人 -->
	<head>		  	<!-- 这是头部信息 -->
  	<title></title>	<!-- 这是页面标题 -->
  </head>							
	<body></body>	<!-- 这是身体主要内容 -->
</html>
    • 在html标签中有一个属性代表语言
    <html lang="en">      <!-- 语言:英语 --> 
</html>
    • 基于基本的架构下，其他的所有页面内容，都是写在head和body中
  • head标签中的内容
    • head标签里面是编写页面特征的地方
    • meta标签是提供有关页面元素信息的标签
    <head>                          
    
    <!--title是不可以省略的-->
    <title>如果没有加title，浏览器会自动加上</title>

    <!--设置字符集-->
    <meta charset="UTF-8" />

    <!--设置搜索关键字，代表页面特征-->
    <meta name="keywords" content="java,jsp"/>
  
  	<!--对网页进行描述-->
    <meta name="description" content="这里是网页的描述"/>

    <!-- ----------------------分割线-------------------------- -->
    <!-- 更换标题logo -->
    <link rel="icon" type="image/x-icon" href="">
    <!--还有就是css和js的引用-->
    
</head>
  • body标签中的内容
    • 所有的页面内容都是写在body里面的
    <body>
	今天的天气很好，今天的东京不太热！
  这里是页面内容的编写的地方
</body>
`moon`晓龙
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
[HTML]基础
m0_72058032的博客
07-08 228
什么是HTML？二、HTML的基本结构 三、基本标签四、小练习总结 注： 相同点：一级到六级标题都具有加粗的作用不同点：字号依次减小 （单纯变粗）或 （有强调意义）（单纯变斜）或
【前端学习】HTML基础知识
Caarolin的博客
08-23 290
W3School HTML基础知识重点梳理 一、元素和属性 1. 空元素 关于没有关闭标签的空元素，如<br>, <hr>，最好的方法是在开始标签中添加斜杠<br /> 2. 属性引号问题 属性值可以用单引号或双引号，但是如果属性值本身有双引号，那么必须要用单引号 3. 注释： <!-- coments --> 4. <p&...
HTML基础知识
xuan971130的博客
03-02 2880
一、基础知识： 1.网站：许多网页的集合。 2.HTML：超文本标记语言（Hyper Text Markup Language），用来描述网页的一种语言。不是一种变编程语言，而是一种标记语言。 3.浏览器内核（渲染引擎）：负责读取网页内容，整理讯息、计算网页的显示方式并显示页面。 4.Web标准的组成 ...
HTML基础知识点
qq_40046544的博客
07-27 8534
网页是一个包含HTML标签的纯文本文件，它可以存放在世界某个角落的某一台计算机中，是万维网中的一页，是超文本标记语言格式。它通常是由图片、文字、链接、声音、视频等元素组成。通过网页浏览器访问。HTML指的是超文本标记语言（HyperTextMarkupLanguage），它是用来描述网页的一种语言。web标准也成为网页标准，它是由一系列标准组成，这些标准大部分由W3C负责定制，也有一些标准由其他标准组织制定。绝对路径指目录下的绝对位置，可以直接到达目标位置，通常从盘符开始的路径。例如D从。...
HTML基础知识点大全
m0_69674158的博客
05-04 6828
一、什么是HTML HyperText Markup Language，即超文本标记语言 二、第一个HTML <！doctpye html> <html> <head></head> <body></body> <html> 三、常用的标签🀄️🀄️🀄️ 1⃣️p 标签 ，段落标签，占整行 2⃣️img 图片标签： ①src 图片路径：绝对路径http://xxx.xx/xx/x.jpg 相对路径..
html基础知识
12-04
html基础知识html基础知识html基础知识html基础知识html基础知识
Html基础知识点.docx
07-23
Html 基础知识点 Html 是一种标记语言，用于创建网页的结构和内容。以下是 Html 基础知识点： 一、Html5 文档类型和字符集 * Html5 文档类型：<!doctype html> * Html5 字符集： 二、Html5 Canvas 元素 * ...
html基础知识1111
最新发布
03-26
html基础知识1111
HTML基础知识点汇总
12-04
HTML 基础知识点汇总 HTML（Hypertext Markup Language，超文本标记语言）是网页设计的基础语言，它将影像、声音、图片、文字等连接显示出来。HTML 语言使用标记式的指令（Tag），将网页文件组织起来，并由浏览器...
Vue实战-实现登陆页面
热门推荐
MY9_19的博客
06-09 3万+
Vue实战-实现登陆页面 文章目录Vue实战-实现登陆页面1 前期准备1.1 安装Node.js1.2 安装webpack1.3 安装vue-cli2 搭建Vue项目2.1 创建项目2.2 项目目录2.3 导入Element UI3 实现登陆页面3.1 修改App.vue3.2 创建Login.vue3.3 配置路由4 实现登陆功能4.1 导入axios4.2 导入qs和Mock4.3 编写提交js4.4 编写Mock测试数据 1 前期准备 1.1 安装Node.js 官网下载地址：https://nod
【HTML】表单和表格配合案例
MY9_19的博客
04-20 1831
表单和表格配合案例 使用表格和表单相互嵌套，将表格实现可填写，效果图如下： Html示例： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>人员信息</title> <link rel="stylesheet" href="for_table.css"> </head> <body> <div
【HTML】超链接标签
MY9_19的博客
03-23 736
超链接标签 标签：<a href=""> </a> 属性： href：超链接跳转链接，里面的内容就是一个URL(协议://ip地址:端口号/虚拟路径？参数=？&参数2=?) 注意：url在配置文件中：&amp;是&符号的转译 当href=“#”;时，不会跳转任何页面，但是有一个回到页面顶部的效果 target：设置在哪个窗口打开 _self ：默认值，在当前窗口打开 _blank：在新窗口跳转 name：名字(锚点：在同一个页面做跳转)
【HTML】常用的元素标签
MY9_19的博客
03-23 263
HTML常用元素标签 文章目录HTML常用元素标签1、Html中基本的标签分类2、标题标签3、段落标签4、特殊的标签5、实体字符 1、Html中基本的标签分类 html中标签是灵魂，基本上html中的基本标签分为三类，分为 块级标签：独占一行,可以对快级标签设置宽度，高度，对齐方式等属性，设置完后依旧独占一行 最经典的块级标签：div <!-- div中的内容换了行，说明div是块级比奥钱 --> <body> 我是div外面的标签 <div>
【HTML】form表单
MY9_19的博客
04-20 245
form表单 文章目录form表单1、什么是表单2、表单元素input标签下拉框文本域label绑定3、表单元素的属性4、H5新增表单元素5、H5新增表单元素属性 1、什么是表单 之前的表格是像用户展示数据，那么表单就是用户输入信息，然后发送给后台数据库，让页面具有交互性 标签：<form></form> 注意：form是块级元素，form之间不可以嵌套，但是一个页面可以有多个form表单 属性： <form name="提交的名称" action="提交的url" met
【HTML】表格标签
MY9_19的博客
04-02 229
表格标签 文章目录表格标签1、网页中的表格2、tr的属性3、td的属性4、合并单元格5、表格小案例 1、网页中的表格 网页中的表格，是给用户展示数据，不可以填写数据，特点是同行等高，同列等宽 标签：table>tr>td*num table table-表格，一个表格最外层的标签 tr table row-表格行，表格中的一行 td table data cell-表格列，表格中的一列 caption 表格的标题，写在table下面，默认居中 属性： bor
【HTML】列表标签
MY9_19的博客
04-02 172
列表标签 文章目录列表标签1、有序列表(Order list)2、无序列表(Unordered List)3、自定义列表(definition list) 1、有序列表(Order list) 标签：ol>li*num 属性： type 设置符号的类型，默认是1，可取值为 a A i I start 设置是重第几个数字开始，取值为数字 reversed 倒序，当前属性的参数等于属性值，可以不写参数 Html示例： <body> <!-- 设置符号为大写字母，
【HTML】内联框架和语义化标签
MY9_19的博客
04-20 140
文章目录iframe内联框架语义化标签 iframe内联框架 什么是iframe框架： iframe就是在当前页面可以实现嵌套其他的页面，相当于一个小盒子，里面可以加载其他页面 标签：<iframe src="" name=""></frame> 属性： src 嵌套的页面的地址 name 框架名称，可以实现a标签点击跳转时，目标为内联框架的名称 frameborder 框架的边框 scrolling 设置是否有滑动条 Html示例
Html知识点汇总.docx
08-29
...它是Web开发的基础，允许开发者通过各种标签...这些只是HTML基础知识的一部分，实际开发中还有表格、列表、链接、图像、表单、框架、多媒体等诸多元素和属性。熟练掌握这些基本概念是成为一名合格的前端开发者的基础。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值