【html+css网站设计】

最新推荐文章于 2024-08-10 10:42:27 发布

小翔很开心

最新推荐文章于 2024-08-10 10:42:27 发布

阅读量1.2k

点赞数

分类专栏：我在CSDN学前端HTML和CSS 文章标签： html css 前端

本文链接：https://blog.csdn.net/qq_26930625/article/details/131483497

版权

我在CSDN学前端HTML和CSS 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

B站听课笔记：
对html和css的基本了解，后续将深入学习。

1.vscode常用设置

1.1 打开文件

1）文件 – 打开
2）直接拖拽

1.2 新建文件

1）右击文件 – 新建
2）文件名称右侧 – +

1.3 自动保存(ctrl+S)

管理 – 设置

1.4 文件重命名

右击文件 – 重命名 (F2)

1.5 删除文件

右击文件 – 删除 (delete)

2.vscode常用快捷键

快捷键：eclipse插件

2.1 自动补全HTML基本结构

输入html:5 或者 ! ，回车即可。

2.2 标签自动补全

tab 或者回车

2.3 复制当前行|复制多行

ctrl+alt+向下键

2.4 删除当前行|删除多行

ctrl+D

2.5 单行注释|取消单行注释

ctrl + /

2.6 多行注释|取消多行注释

ctrl+shift+/

2.7 统一编辑

按住alt–点击统一编辑的位置

2.8 生成多个

数字
例子：p10 – 回车

2.9 文字

{文字}

2.10 打开浏览器

alt+B

2.11 快捷键可以组合使用

p{哈哈哈哈}*10

2.12 关闭侧边栏

ctrl+B

2.13 其他快捷键

ctrl+C 复制
ctrl+V 粘贴
ctrl+X 剪切
ctrl+A 全选
ctrl+Z 撤销
ctrl+S 保存
window+D 回到桌面
window+E 打开文件资源管理器
window+L 锁屏

2.14 打开浏览器控制台

1）F12 (Fn+F12)
2）右击网页空白位置 – 检查
3）ctrl+shift+i

3.HTML和CSS的区别

HTML：网页中的内容，例如：图片、文字、视频等。（身体）
CSS：网页的样式，例如：文字颜色、大小、图片的大小、位置等。（衣服）

4.HTML介绍

4.1 简介

HTML：超文本标记语言
作用：写网页结构内容例如：图片、文字、视频等
文件后缀：.html 或者 .htm

4.2 标签标记元素

HTML由标签组成，标签是尖括号包含的关键词，例如：

 //<p>  <body>  <head>

tag：标签；element：元素。

分类：

双标记，封闭类型标记。例子：

//<p>   段落   </p>  
开始标记  结束标记      双标记之间可以写任意内容

单标记，非封闭类型标记，空标记。例子：

//<meta/>  (单标记的 / 可以省略)

4.3 HTML版本

最新版本为HTML5

4.4 浏览器

作用：解析HTML代码，查看网页效果
主流浏览器：谷歌、火狐、Opera、苹果、IE

4.5 html属性

作用：用来修饰HTML元素
语法： $属性 = " 属性值 "$ 双标记写在开始标记中，单标记写在“ / ”前面，一个标签可以有多个属性，多个属性之间用空格隔开，不区分前后顺序。
例子：

//双标记<p style="" class="" id=""></p>  
//单标记<hr class="" id=""/>

4.6 html语法

不区分大小写，推荐小写；
HTML忽略多余的空格（有多个空格的时候，只会展示一个空格）；
HTML由浏览器解析执行，由上往下，由左往右的顺序。

5.网页标题

    <h1>一号标题</h1>
    <h2>二号标题</h2>
    <h3>三号标题</h3>
    <h4>四号标题</h4>
    <h5>五号标题</h5>
    <h6>六号标题</h6>

一号标题字体最大，六号标题字体最小。
标题标签都是在网页垂直显示，内容居左，加粗

建议：推荐使用2-5号标题，如果使用一号标题，一个网页推荐只有一个一号标题

添加标签属性时：
$a l i g n = ""$ 设置元素内容的水平对齐方式，默认left居左，取值center居中，取值right居右。