前端入门：第一天学习总结

需积分: 10 139 浏览量更新于2024-08-05 收藏 16KB MD 举报

"前端基础第一天的学习内容，包括网页的基本结构标签和VSCode的使用方法" 在前端开发中，学习基础知识是至关重要的第一步。本资源主要涵盖了前端页面的基本结构和如何使用Visual Studio Code（VSCode）进行网页开发。首先，每个HTML网页都有一个基本的结构，也称为“骨架标签”。这些标签包括`<html>`、`<head>`和`<body>`。`<html>`标签是页面中最大的标签，被称为根标签，它包裹着整个页面的内容。`<head>`和`<body>`标签是并列关系，分别用于存放元信息（如标题、样式表链接等）和实际可见的内容。在`<head>`中，通常需要设置`<title>`标签来定义网页的标题，这将在浏览器的标签页中显示。`<body>`则包含文档的所有内容，比如文字、图片、链接等，所有用户在浏览器中看到的元素都应放在`<body>`内。此外，HTML标签有单标签和双标签之分。双标签如`<html>`、`<head>`和`<body>`，它们有开始和结束标签；而单标签如`<a/>`，没有结束标签。标签之间的关系可以是包含或并列。在上述示例中，`<head>`和`<title>`是包含关系，`<head>`和`<body>`是并列关系。接下来，我们探讨了如何使用VSCode创建和运行HTML页面。VSCode是一款强大的代码编辑器，适合前端开发。新建文件后，保存为`.html`格式，然后可以通过快捷键（Ctrl+N）创建新文件。输入`<!DOCTYPE html>`并按Tab键，VSCode会自动生成HTML5的基础骨架结构。此结构包括`<meta>`标签，用于指定字符集（charset="UTF-8"）、浏览器兼容性（X-UA-Compatible="IE=edge"）以及页面的视口设置（viewport="width=device-width, initial-scale=1.0"`），这些元信息有助于确保页面在不同设备和浏览器上的正确显示。在`<body>`中添加内容，如示例中的“第一次用vscode创建页面”，最后选择浏览器运行即可查看结果。通过VSCode的这些基本操作，开发者可以快速地构建和预览HTML页面，极大地提高了开发效率。随着对前端基础知识的深入理解和实践，开发者可以进一步学习CSS样式表和JavaScript脚本，实现更复杂的网页交互和设计。

篝篝

粉丝: 0

前端入门：第一天学习总结

前端每日记录第一天.md

前端第二天笔记.md

JavaScript学习第一天.md

JavaScript进阶第一天.md

vue笔记的第一天回顾.md

第一星期的VUE笔记.md

pink老师Javascript基础PPT.zip

js md5 倒计时 等js文件

两天撸一个天气应用微信小程序.zip

FEE--2015--SPRING:@TheIronYard--Orlando 2015 年Spring前端工程团队的课程项目

最新资源

js md5 倒计时等js文件