web前端骨架与工具
web前端的使用工具为:Visual Studio Code
骨架:在工具中输入英文状态下的 !即可出现骨架,无需自己手写
首先先在Visual Studio Code中创造一个HTML的文件,然后输入英文状态下的 “ !”
代码如下:
<!-- 如何写注释:一般程序默认 ctrl+/ (/此符号不是数字盘上的是在英文盘上的)
也可以 shift+ctrl+p 调出命令指令 再搜索 注释 然后自己更改快捷键 其他快捷键也可以这样修改 -->
<!DOCTYPE html>
<!-- <!DOCTYPE html> 表示的是html5标准网页声明 -->
<html lang="en">
<!-- lang 表示你所写的内容是什么语言 en是英语 zh-CN是中文 JS-JP-->
<head>
<!-- head表示头 写标题 -->
<meta charset="UTF-8">
<!-- charset是<meta>标签的一个属性,用来指定字符类型;utf-8是指使用字符编码类型 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- 这句话其实是指定浏览器按某种方式渲染 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--
viewport就是设备的屏幕上能用来显示我们的网页的那一块区域。
content属性值 :
width:可视区域的宽度,值可为数字或关键词device-width
height同理width
intial-scale:页面首次被显示是可视区域的缩放级别,取值1.0则页面按实际尺寸显示,无任何缩放
maximum-scale=1.0, minimum-scale=1.0;可视区域的缩放级别,maximum-scale用户可将页面放大的程序,1.0将禁止用户放大到实际尺寸之上。
user-scalable:是否可对页面进行缩放,no 禁止缩放
-->
<title>第一个网站</title>
<!-- title 中写的是网页标题 -->
</head>
<body>
<!-- body 表示身体 写主要内容 -->
<!-- h1-h6 为一级到六级标题 都自带加粗 字体逐级变小 独占一行 -->
<h1>第一个网站</h1>
<!-- <h2>第一个网站</h2>
<h3>第一个网站</h3>
<h4>第一个网站</h4>
<h5>第一个网站</h5>
<h6>第一个网站</h6> -->
<p>段落内容</p>
<p>段落内容</p>
<!-- <p></p> 表示的是段落 也就是语文的内容分段 两个<p></p>之间存在间隙 -->
<hr>
<!-- <hr> 表示的水平分割线 -->
<b>加粗</b>
<!-- <b></b> 表示的是加粗 -->
<u>下划线</u>
<!-- <u></u> 表示的是下划线 -->
<i>倾斜</i>
<!-- <i></i> 表示的是倾斜 -->
<s>删除线</s>
<!-- <s></s> 表示的是 删除线 -->
<strong>加粗</strong>
<!-- <strong></strong> 表示的是加粗 -->
<ins>下划线</ins>
<!-- <ins></ins> 表示的是下划线 -->
<em>倾斜</em>
<!-- <em></em> 表示的是倾斜 -->
<del>删除线</del>
<!-- <del></del> 表示的是 删除线 -->
<!-- 两者在内容呈现效果上没有区别 主要区别是语义上 下者表示更加的重要 可以这么说就是写给看代码的人看的 -->
<!-- 例如:本来原价999 现在卖666 然后999要有删除线 应该使用下者 表示更加的重要 让看代码的人一眼就看见 -->
</body>
</html>
<!-- 标识有两种 -->
<!-- 第一种 例如:<strong></strong> 意思是加粗 主要运用于需要圈出内容范围的-->
<!-- 第二种 例如:<br> 意思是换行 无需圈出内容范围 直接使用 -->
橙色是代码,绿色是注释
基本解释已经写在代码的注释上了
浙公网安备 33010602011771号