首页 > 其他分享 >1、前端知识简介

1、前端知识简介

时间:2023-06-26 17:38:42浏览次数:43  
标签:元素 网页 简介 前端 知识 编辑器 HTML 文档 标签

1.网页

1、什么是HTML

HTML指的是超文本标记语言(Hyper Text Markup Language),它是用来描述网页的一种语言。

HTML不是一种编程语言,而是一种标记语言(markup language)

2、网页的形成

网页是由网页元素组成的,这些元素是利用html标签描述出来,然后通过浏览器解析来显示给用户的 。

前端人员开发代码---->浏览器显示代码(解析、渲染)---->生成最后的Web页面

2、HTML简介

1、HTML 编辑器推荐

可以使用专业的 HTML 编辑器来编辑 HTML,给大家推荐几款常用编辑器:

这里推荐安装vscode,专业的代码编辑器,有代码提示、预览、格式报错等较为方便。

a、预览插件安装

1、前端知识简介_前端开发

b、效果展示

1、前端知识简介_Text_02

c、使用浏览器展示

1、前端知识简介_HTML_03

2、最小的HTML文档

<!DOCTYPE html>	// 声明必须位于 HTML5 文档中的第一行,
<html>
<head>
<meta charset="utf-8">	// 中文网页需要声明编码,否则会出现乱码
<title>文档标题</title>
</head>
 
<body>
文档内容......
</body>
 
</html>
  • <!DOCTYPE html> 声明为 HTML5 文档
  • <html> 元素是 HTML 页面的根元素
  • <head> 元素包含了文档的元(meta)数据,如 <meta charset="utf-8"> 定义网页编码格式为 utf-8
  • <title> 元素描述了文档的标题
  • <body> 元素包含了可见的页面内容

3、HTML 标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

  • HTML 标签是由尖括号包围的关键词,比如 <html>
  • HTML 标签通常是成对出现的,比如 <b> 和 </b>
  • 标签对中的第一个标签是开始标签,第二个标签是结束标签
  • 开始和结束标签也被称为开放标签闭合标签


a、基础标签
  1. HTML 标题(Heading)是通过<h1> - <h6> 标签来定义的。
  2. HTML 链接是通过标签 <a> 来定义的。
  3. HTML 图像是通过标签 <img> 来定义的.
  4. HTML 段落一般使用 <p> 标签
  5. HTML 常用 <div> 标签用于分组的块级元素
b、基础标签效果

1、前端知识简介_Text_04

以上为简单介绍html语言及标签内容、有问题可在评论区留言讨论。


标签:元素,网页,简介,前端,知识,编辑器,HTML,文档,标签
From: https://blog.51cto.com/houxk/6556123

相关文章

  • Python基础知识
    1.变量和简单数据类型1.1变量变量只能包含字母、数字、下划线,并且不能以数字开头变量名不能包含空格不要讲python关键字和函数作为变量名。变量名应简短又具有描述行被赋值的内容应该用双引号或单引号括起来1.2字符串title():将字符串首字母变为大写upper():将字符串......
  • vue06_前端工程化
    今日目标1.能够了解模块化的相关规范2.了解webpack3.了解使用Vue单文件组件4.能够搭建Vue脚手架5.掌握Element-UI的使用1.模块化的分类A.浏览器端的模块化1).AMD(AsynchronousModuleDefinition,异步模块定义)​代表产品为:Require.js​2).CMD(CommonModuleDefi......
  • 前端工程化 (开始)
    为何偏偏JavaScript没有模块呢?如果要追溯历史原因,JavaScript之父——BrendanEich最初设计这门语言时只是将它定位成一个小型的脚本语言,用来实现网页上一些简单的动态特性,远没有考虑到会用它实现今天这样复杂的场景,模块化当然也就显得多余了。随着技术的发展,JavaScript已经不仅仅......
  • 前端文件上传的几种交互造轮子 | 京东云技术团队
    背景前端文件上传本来是一个常规交互操作,没什么特殊性可言,但是最近在做文件上传,需要实现截图粘贴上传,去找了下有没有什么好用的组件,网上提供的方法有,但是没找完整的组件来支持cv上传,经过了解发现可以用剪贴板功能让自己的cv实现文件上传,于是自己就整合了目前几种文件上传的交互方式......
  • 前端实现权限控制 - 三种方法 - 不同的角色有不同的路由映射
     有代码:https://gitee.com/zhu-longxu/zhulx-rbacps:注意本地路由router有哪些规则?服务器返回的数据格式? 方法一:本地路由router包含静态路由规则;虽然动态路由规则定义了但是没有注入;动态路由规则在登录判断的时候选择性是否注入;服务器返回数据格式 [ "news", "cat......
  • 核心交换机六个基础知识
    一、背板带宽背板带宽也称交换容量,是交换机接口处理器或接口卡和数据总线间所能吞吐的最大数据量,就像是立交桥所拥有的车道的总和。由于所有端口间的通信都需要通过背板完成,所以背板所能提供的带宽,就成为端口间并发通信时的瓶颈。带宽越大,提供给各端口的可用带宽越大,数据交换速......
  • web前端性能优化之资源文件加载优化
    前言首屏速度是用户体验的最关键一环,而首屏速度最大的决定性因数就是资源的加载速度而资源的加载速度=资源大小+网速资源大小影响的方面有1、压缩(如Gzip)2、一部分代码分割出来做异步加载,需要的时候在加载3、写代码的时候尽量精简本文主要针对,资源文件加载的优化。异步资......
  • 前端Vue自定义精美tabs,可设置下划线图标 热门标题
    前端Vue自定义精美tabs,可设置下划线图标热门标题,下载完整代码请访问uni-app插件市场地址:https://ext.dcloud.net.cn/plugin?id=13186效果图如下:cc-beautyTabs使用方法<!--tabchange:tab选择事件tabList:tab数据--><cc-beautyTabs@tabChange="tabChange":tabList="t......
  • 前端Vue自定义滚动卡片,可以用于商品海报生成
    前端Vue自定义滚动卡片,可以用于商品海报生成,下载完整代码请访问uni-app插件市场地址:https://ext.dcloud.net.cn/plugin?id=13189实现代码如下:cc-scroolCard使用方法<!--dataInfo:滚动卡片数据 swiperIndex:滚动序列@change:滚动事件--><cc-scroolCard:dataInfo="data":......
  • 前端 js 获取 baseurl
    如果部署一个网站到网络需要知道对应的ip,这个时候前端的baseurl需要动态调整,一般是在public里面写个config.js,部署的时候改这个config.js里面的内容有一种偷懒的方式就是用户是知道你的ip的,这个时候可以用window.location.host获取当前浏览器的host网址拿这个当bas......