百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 热门文章 > 正文

前端学习第二天——制作我们的第一个网页

bigegpt 2025-03-25 11:16 11 浏览

今天我们来制作我们的第一个网页,我们先在桌面新建一个记事本文档:

新建之后重命名,将拓展名更改为html(就是点后面的txt改成html)然后拖到sublime图标上打开或者右键——打开方式——选择sublime。

法①打开之后可以在界面中写一般编辑器都会有提示,直接按回车生成完整的html标签就行,法②如果安装了emmet插件的话直接在编辑器中输入 ! 然后编辑器会有提示,再按tab键即可生成完整的html标签(注:两种方式下生成的html标签不完全一样,此为html版本不同导致,现阶段不用在意)。

我这个是用第二种方法生成的,html语言的特点之一是标签化,就像图中的代码都是带有<>的一般开头和结尾的标签不完全一样,例如html的投标签为而结束标签为(有的标签是成对出现的,而有的标签不是,之后遇到会讲)。(HTML代码中所有的标点符号和字母全是英文半角状态下否则会报错)。

我们的所有html代码都要写在他俩中间。

图中的head标签为对网页的设置(代码内容不会显示在网页中),

表示字符编码的方式,计算机是不识别汉语的,为了防止出现乱码的情况,所以要将编码的方式改为utf-8。

这行代码主要是为了解决兼容性问题,写项目的时候会用到,(如果是用第一种方法生成的html标签则不会有这行代码)。

Document这行代码是我们网页的题目2,document可以改成我们想要的网页题目。

我们所有在网页中展示的部分都要写在body标签中。

下面我们来写我们的第一行代码。

作者最帅

作者最帅

作者最帅

作者最帅

作者最帅

h1是标题标签,一共有六个h标签,分别为h1,h2,h3,,,,,h6,字体由大到小。

strong标签是加粗用的,可以对字体进行加粗。

em标签的作用是将字体设置为斜体。

标签是可以嵌套的,例如:

我们可以右击,然后点 open in Browser在浏览器中打开,作者建议用谷歌浏览器,并且设为默认浏览器。


打开之后浏览器会显示如下界面:

好啦,今天就学到这里,有什么问题可以在评论区留言或者私聊我呦。

相关推荐

或者这些Joplin插件也可以帮助你的笔记应用再一次强大

写在前面距离上次分享《搭建私有全平台多端同步笔记,群晖NAS自建JoplinServer服务》已过去一段时间,大家是否开始使用起来了呢?如果你和我一样已经使用过Joplin有一段时间了,那或许你也会...

Three.JS教程4 threejs中的辅助类

一、辅助类简介Three.js提供了一些辅助类(Helpers)以帮助我们更容易地调试、可视化场景中的元素。ArrowHelepr:创建箭头辅助器;AxisHelper:创建坐标轴辅助器;BoxH...

第2章 还记得点、线、面吗(二)(第二章还能敲钟吗)

glbgltf模型(webvrmodel)-gltf模型下载定制,glb模型下载定制,三维项目电商网站在线三维展示,usdz格式,vr模型网,网页VR模型下载,三维模型下载,webgl网页模型下载我...

如何检查Linux系统硬件信息?从CPU到显卡,一网打尽!

你可能会问:“我为什么要关心硬件信息?”答案很简单:硬件是Linux系统的根基,了解它可以帮你解决很多实际问题。比如:性能调优:知道CPU核心数和内存大小,才能更好地调整程序运行参数。故障排查:系统卡...

SpriteJS:图形库造轮子的那些事儿

从2017年到2020年,我花了大约4年的时间,从零到一,实现了一个可切换WebGL和Canvas2D渲染的,跨平台支持浏览器、SSR、小程序,基于DOM结构和支持响应式的,高...

平时积累的FPGA知识点(6)(fpga经典应用100例)

平时在FPGA群聊等积累的FPGA知识点,第六期:1万兆网接口,发三十万包,会出现掉几包的情况,为什么?原因:没做时钟约束,万兆网接口的实现,本质上都是高速serdes,用IP的话,IP会自带约束。...

芯片逻辑调度框架设计 都需要那些那些软件工具

设计芯片逻辑调度框架通常需要使用以下软件工具:1.逻辑设计工具:例如Vivado、Quartus、SynopsysDesignCompiler等,用于设计和实现逻辑电路。2.仿真工具:例如Mo...

ZYNQ与DSP之间EMIF16通信(正点原子领航者zynq之fpga开发指南v3)

本文主要介绍说明XQ6657Z35-EVM高速数据处理评估板ZYNQ与DSP之间EMIF16通信的功能、使用步骤以及各个例程的运行效果。[基于TIKeyStone架构C6000系列TMS320C6...

好课推荐:从零开始大战FPGA(从零开始的冒险4399)

从零开始大战FPGA引子:本课程为“从零开始大战FPGA”系列课程的基础篇。课程通俗易懂、逻辑性强、示例丰富,课程中尤其强调在设计过程中对“时序”和“逻辑”的把控,以及硬件描述语言与硬件电路相对应的“...

业界第一个真正意义上开源100 Gbps NIC Corundum介绍

来源:内容由「网络交换FPGA」编译自「FCCM2020」,谢谢。FCCM2020在5月4日开始线上举行,对外免费。我们有幸聆听了其中一个有关100G开源NIC的介绍,我们对该文章进行了翻译,并对其中...

高层次综合:解锁FPGA广阔应用的最后一块拼图

我们为什么需要高层次综合高层次综合(High-levelSynthesis)简称HLS,指的是将高层次语言描述的逻辑结构,自动转换成低抽象级语言描述的电路模型的过程。所谓的高层次语言,包括C、C++...

Xilinx文档编号及其内容索引(部分)

Xilinx文档的数量非常多。即使全职从事FPGA相关工作,没有几年时间不可能对器件特性、应用、注意事项等等有较为全面的了解。本文记录了我自使用Xilinx系列FPGA以来或精读、或翻阅、或查询过的文...

Xilinx Vivado联合Modelsim软件仿真

引言:Xilinx公司Vivado开发软件自带仿真工具,可以实现一般性能的FPGA软件仿真测试,其测试执行效率以及性能都不如第三方专用仿真软件Modelsim强。本文我们介绍下如何进行Vivado20...

体育动画直播是怎么做出来的?从数据到虚拟赛场的科技魔法!

你是否见过这样的比赛直播?没有真实球员,却能看梅西带球突破?足球比赛变成动画版,但数据100%真实?电竞比赛用虚拟形象直播,选手操作实时同步?这就是体育动画直播——一种融合实时数据、游戏引擎和AI的...

Dialogue between CPC and political parties of neighboring countries held in Beijing

BEIJING,May26(Xinhua)--TheCommunistPartyofChina(CPC)inDialoguewithPoliticalPartiesof...