前端第一天（笔记）

愿望研究所.

已于 2024-05-26 11:50:53 修改

阅读量927

点赞数 23

文章标签：前端

于 2024-05-25 22:45:15 首次发布

本文链接：https://blog.csdn.net/2303_80137578/article/details/139193728

版权

一、快捷键

1)快速复制一行

单击选中 shift + Alt +下箭头键

2）选定多个相同的单词

双击选中标签长按ctrl + d 输入要改的标签

3）添加多个光标

ctrl alt 箭头

4）全局替换某些单词

ctrl + h 再点第二个图标全局替换

5）快速跳转到某一行

ctrl + g

6)选择某个区块

单击区域起点先长按shitf + Alt 鼠标拖动

7）放大缩小

ctrl +或ctrl -

8）回到上一步

ctrl + z

9）回到下一步

ctrl + y

10）注释

单行 ctrl + /

单行or多行 shift + alt + a

为方便在管理——键盘快捷方式——搜索注释——改为ctrl shift /仅仅比单行多了个shift

二、开发工具

1) <!DOCTYPE html>

2)<html lang ="en">告诉浏览器或搜索好评引擎这是一个英文网站，本页面采取英文来表示

<html lang="zh-CN" 中文

fr 法文

3)<meta charset=" UTF-8 "/>万国码，不写就会乱码

三、标签语义

1)标题标签

<h1>---<h6> 一到六级

<h1>我是一级标题</h1>

标签语义：作为标题使用，并且依据重要性递减

特点：1.加了标题的文字会加粗，字号也会依次变大。

2.每个标题独占一行。

2）段落标签和换行标签（重要）

<p>我是一个段落标签</p>

paragraph

特点：1.段落和段落之间保有空隙。

2.文本在一个段落中会根据浏览器窗口的大小自动换行。

<br/> 换行标签

强制换行

break 意为打断、换行

特点:1,单标签。

2.只是简单地开始新的一行，和段落不一样，段落之间会插入一些垂直的间距。

3）文本格式化标签

粗体斜体下划线等效果

粗体

<strong>加粗的内容</strong>

<b>加粗的内容</b> strong语义更强烈

斜体

<em>倾斜的内容</em>

<i>倾斜的内容</i> em语义更强烈

删除线

<s></s> del

下划线

<u></u> ins

4）<div>和<span>标签

<div>和<span>是没有语义的，他们是一个盒子，用来装内容的。

div division 表示分割、分区

span 表示跨度、跨区

特点：

1.<div>标签用来布局，但一行只能放一个<div>,一个div语句独占一行。大盒子

<h>标签也是独占一行

2.一行可以放多个span。小盒子

5)图像标签和路径（重点）

1.图像标签

<img />

image 的缩写

scr是<img>标签的必须属性，它用于指定图像文件的路径和文件名

属性：属于这个图像标签的特性

alt 替换文本当图像不能显示时显示文本

<img src="文件名" alt="我是文件名"/> 当寻找不到文件名时候显示文本我是文件名。

title 提示文本鼠标放到图像上提示的文字

width 像素设置图像的宽度

height 像素设置图像的高度

宽度和高度一般只修改其中一个否则会被压缩比例

border 像素设置图像的边框粗细

特点：

1.图像标签可以有多个属性

2.属性之间不分先后顺序，属性与属性，属性与标签都要用空格分开

3.格式：属性="值"

四、路径

1)相对路径 / 左下划线

与html页面同一

级同一级路径 <img src="img.gif"/>

在html页面下一级 / 下一级路径 <img src="images/img.gif"/>

在html页面上一级 ../ 上一级路径 <img src="../img,gif"/>

2)绝对路径 \ 右下划线

就是文件夹最上面那个路径如C:\BitCenter

四、超链接标签<a>

1.语法格式

<a href="目标文件" target="目标窗口弹出的方式">文本或图像或</a>

目标窗口弹出的方式: _self 当前窗口打开页面 _blank新窗口打开页面

2.链接的分类

1)外部链接wy

anchor 锚

2）内部链接：网站内部页面之间的相互链接

直接链接内部页面名称即可

能打开文件夹里面的其他html页面

3）空连接:

如果当时没有确定链接目标时,<a href="#">首页</a>

4)下载链接

当href里面的地址是一个文件exe或者压缩包zip，点击<a href="XX.zip">点我下载</a>会下载这个文件

5）网页元素链接

在网页中添加各种网页元素，如文本、图像、表格、音频、视频等都可添加超链接.

6)锚点链接

点击链接--->迅速定位到页面中的指定位置

在链接文本的href属性中，将属性值设置为#名字的形式，如<a href="#名字">第二集</a>

并且将目标文本链接添加一个id属性=名字如<h3 id=“名字”>第二集介绍</h3>

五、特殊字符

只记住前三个其他的使用时再查找

空格符号 &nbsq; （注意每个后面都有分号）意为牛笔space

> 大于号 > greater than

< 小于号 &lt； less than

需要几个字符就敲几遍字符的代码