前端之路-用vscode写第一个html页面

最新推荐文章于 2024-07-25 11:19:16 发布
最新推荐文章于 2024-07-25 11:19:16 发布
阅读量8.8k 收藏 48
点赞数 14
分类专栏： 前端 vscode 文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Silent_crab/article/details/110676284
版权

前端之路-用vscode写第一个html页面


下载软件：https://code.visualstudio.com/
进入该网站，下载即可

安装插件
在这里插入图片描述

点击拓展按钮，搜索html，下载相关插件
搜索open in browser,安装一下，这样你的网页就可以在浏览器中显示了
在这里插入图片描述

自己在电脑里创建一个文件夹，这就是你的项目了，在vscode中打开。比较麻烦，但是vscode中没办法直接创建项目。
在这里插入图片描述
我的文件夹起名为FirstProject,在你的文件夹下新建文件
在这里插入图片描述
在这里插入图片描述
给你的文件起名，注意，要加后缀.html
在这里插入图片描述
右侧下方有一个语言模式，点一下。

在这里插入图片描述
在弹出来的框里写html，就配置好语言了

在这里插入图片描述
在页面里输入一个感叹号，然后按回车，会自动帮你补全
在这里插入图片描述
自己输入你想输入的内容，然后 Ctrl +S保存，这步操作一定要做，不然就是一片空白，保存完之后，按ALT+B，你的网页就出现了在浏览器中了

在这里插入图片描述

Silent_crab
关注
专栏目录
使用VScode写一个html页面
10-15
本文给大家分享的是使用vscode编写的第一个html页面的全过程,非常的简单,菜鸟看看就行,高手请略过
使用Html做一个简单的登陆页面
热门推荐
桑稚远方的博客
04-05 5万+
有了登录按钮后，在我们的认知下，肯定按了登录会跳到下一个页面，但是今天只是展示做一个简单的登陆界面，就不写跳转和账号密码验证了；登录页面一般就是账号和密码，另外还需要验证码验证需求，这三个常见的属性是一个项目登陆界面重要组成要素；2.账号密码有了之后，下一步就需要登录了，登录是一个按钮，按钮是一个标签。，所以就不使用验证码了，因为验证码在一个项目中是放在后端的，这次就不做演示；不好意思兄弟们，本人没有美感，尽力了，你们自己找好看的点自己修改；如下面的代码，这一步很简单；
2024从零开始使用VSCode编程（静态页面制作篇）HTML+CSS+JS阶段
最新发布
ssrsrrn的博客
07-25 1737
VSCode第一个前端静态页面的编写
用户注册登录页面的设计与实现
printf_what的博客
06-13 1万+
文章目录前言一、环境搭建二、使用步骤1.引入库2.读入数据总结 前言 利用HTML5、CSS、JavaScript、jQuery以及mongodb数据库的相关知识，使用vscode编译器对Web应用程序的开发，主要实现了登录注册、首页部分功能 一、环境搭建 登录vscode官网下载安装Windows x64位的安装包 打开下载的安装包进行安装，成功后运行，并安装所需要的插件如：汉化插件chinese等等。插件列表如下： 插件名 作用 Auto Rename Tag HTML修改标
VSCODE（三）用户界面
Fishfishfishfishcat
12-10 8752
一、设置 1.1 用户设置和工作区设置 用户设置（User Setting）: 所有VSCODE实例都有效的设置；工作区设置（Workspace Setting）:当前工作区有效的设置。工作区设置可以上传到服务器上方便所有成员共享。 1.2 打开设置 VSCODE有途径进行VSCODE设置，分别是JSON和UI方式。那么如何打开JSON或UI进行设置呢？ 菜单栏选取。FIle-Preference-Settings(Linux)；Code-Preference-Settings(Mac)； 命令面板搜索。
VScode页面开发
m0_74937538的博客
08-04 5587
当一个元素的宽度已知，并且希望它在其容器中水平居中对齐时，可以使用这个属性。11）overflow: hidden该元素的内容若超出了给定的宽度和高度属性，那么超出的部分将会被隐藏，不占位。13）text-overflow: ellipsis的意思就是在文本溢出容器时，使用省略号来表示溢出的部分。7)、input type="radio" 单选按钮，同组按钮内，name值保持一致，互斥，不能同时选中。9)sub下标/sup上标：上下标标签，加入（title=“*******”）链接可显示标签信息。
VScode连接数据库(登录网页)
weixin_50841268的博客
03-23 2708
最近做网页碰到连接数据库的问题，上网查了3天终于搞明白了。我连接的是phpstudy里自带的Mysql数据库。如果要连接自己下载的Mysql数据库的话，再去网上找找方法吧。我还没琢磨出来😑😑😑话不多说，亮实例！
前端学习之路-html笔记
07-17
我的第一个标题 我的第一个段落。 </html> ``` 在这个例子中，`<!DOCTYPE html>`是文档类型声明，告诉浏览器这是一个HTML5文档。`<html>`元素是文档的根元素，包含整个页面的结构。`<body>`元素定义了网页的主体...
web前端网页设计与制作——华夏第一县HTML+CSS+JavaScript
08-10
- **导航栏效果**：使用CSS来设计一个美观且实用的导航栏，以便用户能够方便地浏览网页的不同部分。 - **Banner横幅设计**：在网页顶部放置一个吸引人的横幅，用于展示关键信息或图片。 - **表单元素**：为了增加...
第1章 Web前端开发概述-HTML5+CSS3 Web前端开发与实例教程（微课视频版）配套PPT
06-09
- **作用**：作为信息展示和交互的平台，网页是用户与网站互动的第一界面。 #### 三、Web前端开发相关技术 1. **HTML5**：第五代超文本标记语言，用于构建网页结构的基础语言。 - **特点**：提供了更多的语义化...
基于vscode的仿京东页面
01-12
【基于vscode的仿京东页面】项目是一个针对大学生的Web开发大作业，旨在提供一个具有实际功能的电商平台模拟页面。这个项目涵盖了多个重要的Web开发知识点，包括用户登录、注册、前端验证以及交互式UI设计。 首先，...
VSCODE制作简单登录界面（含验证码）
l7_804829222的博客
04-15 2792
（1）Chinese（Simplified)(简体中文）：适用于VS CODE 的中文语言包。4.选择一张背景图片，将图片放入文件夹中，拖进VS CODE。并新建html文件。2.打开VSCODE,点击左边最下面扩展，下载几个最常用的插件。1.下载vscode，在官网界面点击下载，按照相应的步骤安装。（2）Live Server：打开网页并展现网页的实时变化。3.点击左上角文件，设置为自动保存。（3）open in browser:打开网页。6.将文字与边框输入，注意用br换行。注意：创建桌面的快捷方式。
使用vscode编写第一个Hello World程序页面详细步骤
快乐学习
11-16 7793
前言： 对于编程人员来说，第一个程序几乎必写的都是Hello World，也是代表进入了新的学习篇章吧 一、操作步骤 1.打开vscode（如果没有这个软件，可以从我的文章里面看下载教程），文件---->新建文本文件或者使用快捷键：CTRL+N打开 2.文件-->保存 3.选择文件保存位置后，文件的后缀名txt更改为html，然后点击保存 4.vscode里面第一行输入! 注意：这个!一定是英文输入法的才会显示。如果是中文的！这两个感叹号不会显示出来的 8.任意选择一个浏览器打开（我是选择这个web
用VScode写一个简单html网页
weixin_35756130的博客
02-13 2417
使用 Visual Studio Code 写一个简单的 HTML 网页可以通过以下步骤完成：1.打开 Visual Studio Code；2.新建一个文件，可以使用 .html 作为文件后缀名；3.编写 HTML 代码；4.保存文件；5.使用浏览器打开新建的 HTML 网页文件。 ...
初学者写一个简单的网页
m0_62085973的博客
07-16 3832
第一步：下载一个编辑器下载链接：1、vscode 前端人员必备软件：http://vscode.bianjiqi.net2、新手小白玩玩可下载sublime：https://www.sublimetext.com/3这两款软件 都有代码补全等功能，安装简单。第二步：直接上手操作：新建一个文本文档后缀名改为.html ,导入编辑器 输入英文的！按Tab补全，就会出现的效果啦。
在VScode中写的第一个html程序
Tina_dl的博客
03-04 1万+
小白第一次用VScode 写HTML，希望有帮助（小白的我慢慢学习，记录下来） 首先插件配备好了，写一个HTML测试一下 首先创建一个文件夹，创建一个HTML 文件夹 （或者jQuery文件夹） 下面接着可以在目录下新建文件写一个html 我测试取名 text2 （名字任意，自己取） 注意：写的是html ，则你写的格式的结尾就是 text2.html 如果我打算创建的是 ...
学习Vue的心路历程（二）用Vue实现一个简易的登录页面
qq_63163851的博客
10-16 2734
如果报错可以检查一下是否安装了npm。
注册登录页面
weixin_49289233的博客
11-30 744
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title></title> <style> body { background-image: url("./bg.jpg"); } </style> </head&gt...
计算机毕设Node.js+Vue学生信息管理系统（程序+LW+部署）
nodejs程序设计老哥
12-28 351
项目运行环境配置：Node.js最新版+ Vs项目技术：Express框架+ Node.js+ Vue 等等组成，B/S模式 +Vscode管理+前后端分离等等。环境需要1.运行环境：最好是Nodejs最新版，我们在这个版本上开发的。其他版本理论上也可以。2.开发环境：Vscode或HbuilderX都可以。推荐HbuilderX;3.mysql环境：建议是用5.7版本均可4.硬件环境：windows 7/8/10 1G内存以上；
vscode写一个淘宝网页
06-12
很抱歉，我作为一个语言模型，无法执行实际的编程任务。但我可以向您提供一些指导，以帮助您开始编写淘宝网页。 首先，您需要了解 HTML、CSS 和 JavaScript 这些基本的 Web 技术。您可以在 VS Code 中编写这些代码，并使用 VS Code 的内置服务器托管您的网页并在浏览器中进行预览。 接下来，您需要了解淘宝网站的页面结构和样式，以便您可以模仿它们。您可以使用浏览器的开发者工具来分析淘宝网站的 HTML 和 CSS，并尝试复制它们。 最后，您需要考虑如何使用 JavaScript 来添加交互功能，例如搜索、购物车和登录。您可以使用第三方库或框架，如 jQuery 或 React，来加快开发速度。 总之，编写淘宝网页需要一些基本的前端技能和对淘宝网站的了解。希望这些指导可以帮助您开始。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值