1. 下载vscode和chrome并配置到能用状态;
答:分别去vscode和chrome的官网下载对应软件,然后安装,首先来配置vscode:
在vscode的扩展中分别安装:
- 简体中文,安装完了之后重启,
- 先安装配置开发前端的环境:
- HTML CSS Souport 对html和css的书写提示
- HTML/css/javascript snippets 代码片段生成
如 div 会自动生成<div></div>,
clo 会自动生成console.log(‘object :>> object);
- Auto Rename Tag 标签自动改名
- 主题安装:编辑器主题和文件主题:
one dark推荐使用 - 安装markdown语法检查器
- 安装markdown Preview Enchanced:markdown文件的预览 器
- Liver Server直接在浏览器预览写好的文件,需要在首选项
配置,我们用的是谷歌浏览器
扩展安装完成之后,在微软注册账号,同步配置,以便再次安装后能快速回复配置
- 谷歌浏览器安装完成后,现在开始配置:
为了使用谷歌的搜索引擎,需要安装一个叫做igg的软件扩 展,安装方法:1先下载igg,解压缩到一个文件夹,然后打 开谷歌的扩展,进入开发者模式,然后拖入到开发者界面 即可完成安装。
还可以进去谷歌的应用商店进行下载扩展,可以根据自己的要求安装。常用的插件有,简约,划词语软件等
2. 将课堂上提及的所有标签全部按自己理解写一遍并提交到作业中;
答:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<title>HTML标签演练</title>
</head>
<body>
<a href="#footer">跳转到底部</a> 锚点
标题
<h1>这是标题 1</h1>
<h2>这是标题 2</h2>
<h3>这是标题 3</h3>
<h4>这是标题 4</h4>
<h5>这是标题 5</h5>
<h6>这是标题 6</h6>
段落
<p>天下大事始于细</p>
链接:
<a href="https://www.baidu.cn/" target="_self">百度一下</a>
<hr>
<a href="https://www.baidu.com/" target="baidu">打开小度</a>
<hr>
<iframe srcdoc="<em>点击上面的:小度</em>" name="baidu" width="400"></iframe>
<hr>
锚点的使用:
<div id="footer" name="footer" style="margin-top: 1000px">底部</div>
<a href="#">回到顶部</a>
</body>
</html>
效果:
3. 复习列表,表格和表单
答:
<input> 文本框
<textarea> 文本域
<button> 按钮
<select> 选择框
<option> 选择项
<optgroup>通过 <optgroup> 标签把相关的选项组合在一起:
<fieldset>
<fieldset> 组合相关3信息
<legend>健康信息</legend>
身高:<input type="text" />
体重:<input type="text" />
</fieldset>
<label> 标签为 input 元素定义标注(标记)
效果: