此刻，热烈欢迎你开启编程之旅！不少人认定“网页制作”是那些极客们所独有的领域，然而实际上它较你设想的情形要简便许多。自零基础起步，只要紧密跟随步伐，你同样能够亲自创立出归属于自身的精彩网页。上一期我们已然领略了网页制作的魅力，就在今朝，凭借最为通俗易懂的语言，我们正式投身实战，为你剖析拆解网页制作的每一项核心步骤。
学习目标与成果预览
在着手行动之前，先来瞧瞧我们今日即将达成的作品，我们会从一个空白的文档起始，一步步搭建出一个涵盖首页（也就是登录界面）以及注册页面的简易网站，经由这个实战，你会彻底摆脱“看不懂和学不会”的那种焦虑。
第一步：创建你的第一个项目
所有事情开始的时候都困难重重，然而，去开展项目这样的行为步骤来讲却是极为简易的，它可是我们整个关于编程学习的起始点呢。
启动软件：开启你用到的代码编辑软件，像VS Code、Sublime Text这类，对于刚开始学习的人而言推荐使用VS Code标点符号。
对于新建项目，要在菜单栏里找到“文件”，然后从中找到“新建文件”，或者是“新建项目”。并且如果依照不同的软件，你有可能需要先去创建一个工作区文件夹。
3. 命名跟保存：给你的项目取一个名称，像 my - first - web 这样，并且挑选你打算存放的地方。做完这些之后，创建一个新文件，把它命名为 index.html。如今，一个全新的、空白的HTML界面已然就绪，它正等着你来填入内容。
HTML基础：网页的骨架
HTML也就是超文本标记语言喔算得上是网页的骨架呢靠着“标签”去告知那浏览器哪里属于标题哪里是段落哪里得放置图片呀。
关于页头标题，也就是那个用
文字格式标签，：以往常常运用它去调整文字，可是在现今开发里，我们更倾向于推荐 utilize CSS （层叠样式表）来把控样式。然而明白其原理依旧具备助益：这是红色大号字。
注释标签 ：注释乃供人阅读之用，于网页上并不会予以显示。其对于团队协作以及后期代码维护颇具助益，诸如 这样的情况。
格式排版标签：
：换行符，让文本另起一行。
：水平分割线，用于分隔内容。
部分呈段落标签状，应用于对一篇完整文本段落予以包裹，于浏览器环境下自会在其前后部位增添有些许间距。。
实战：首页设计与背景设置
此刻，我们着手去设计首页那名为index.html的页面。首页乃是网站的门面所在之处，在设计方面需要同时兼顾功能以及美观。
在首页而言，其布局要素是这样的：我们会去创建一个简约的首页，这个首页具备登录功能。其主要的元素之中有种东西是表格，此表格的用途在于放置“用户名”输入框，放置“密码”输入框，还用来放置“登录”按钮以及“注册”按钮。
为首页添加背景图片
第一步，在项目根目录进行动作，这个动作是新建文件夹，此文件夹名为images，要留意命名时的规范，规范通常是使用英文小写形式。完成这个新建动作，能达成一种效果，就是让你的项目具体结构呈现出清晰的状态，进而方便进行管理。
首先要来着手准备图片了，是什么样的图片，是你所青睐的背景区域相关的图片，然后呢要把这般你所喜欢的背景图片放置到哪里去，是放置到名为images的文件夹当中去。
3. 进行代码编写：于index.html的body标签内部（或者借助CSS），运用如下这般的代码去引入背景图片。在此处我们是以行内样式当作示例，以此来辅助你能够直观地进行理解：
属性“background - size: cover;”有着能够保证图片将整个屏幕铺满，并且不会发生变形这种效果。
进阶：注册页面设计
把首页完成之后，接下来我们要着手去制作注册页面 register.html。该注册页面的设计逻辑跟首页有着相似之处，不过其交互元素更为丰富。
注册页面的布局情况是，其核心部分仍然是表格，不过呢，这里面增添了诸多输入项目，也就是像用户名、密码、确认密码、还有邮箱地址这类的，以此来保障用户能够逐步实现信息的提交。
扩展功能：个性化选择
以使得注册体验更为友好的目的，我们能够增添更多个性化的可选项。比如说，像“喜爱颜色”这一项目，能够借助下拉表单（ 标签）予以达成，让用户从预先设定好的颜色里自行选择决定，而非依靠手动进行输入，如此一来，既对数据格式起到了规范作用，又使用户体验得到了提升。
红色
蓝色
绿色
历经上述步骤，我们不只是构建了两个基础的HTML页面而且通晓了从项目创建、骨架建立直至界面打扮的完整进程。从毫无基础到亲自写出可运转的页面，这便是编程的韵致。下一期就要持续深切，给这些页面嵌入更丰饶的交互事理。敬请翘首以盼！标点符号等细节可能有微调，以符合整体风格需求。
Comments NOTHING