复习html
2022.4.9
在学习js 的过程中,我发现我之前上课时学习的html因为时间流逝,很多都忘记了。所以再看一下尚硅谷新出的19年的html的视频,而且老师用的也是vscode,不像之前学习js的时候老师用的Hbuilder。
刚发现使用Emmet语法生成18个a标签时,不会自动换行
解决办法:(36条消息) 解决emmet语法中自动换行问题_小菜团子的博客-CSDN博客_emmet自动换行
vscode代码编辑器折叠所有区域的代码快捷键
查看了使用说明,快捷键如下:
折叠所有区域代码的快捷键:ctrl+k, ctrl+0;
先按下ctrl和K,再按下ctrl和0; (注意这个是零,不是欧)
展开所有折叠区域代码的快捷键:ctrl +k, ctrl+J;
先按下ctrl和K,再按下ctrl和J
自动格式化代码的快捷键:ctrl+k, ctrl+f;
先按下ctrl和K,再按下ctrl和f;
引入reset文件重置浏览器默认样式的时候,
link标签中的href属性地址使用Ctrl+鼠标左键 单击会发现找不到该文件。明明就在另一个文件夹下面。
1. 使用live server插件加载这个html文件 link使用的相对路径的话,浏览器会报以下错误
Refused to apply style from 'http://127.0.0.1:5500/studydemo00/Html/studydemo00/css/reset.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
将link的rel属性删除就不会报错
2. link使用绝对路径的话,会报以下错误
Not allowed to load local resource:
查阅资料显示 浏览器为了安全不允许访问 ,所以需要改为相对路径即可 ————>视频老师使用的就是这个方法。
同时,文章告诉我 注意不要在左侧文件上右击复制相对路径,这个路径计算机仍然是找不到的 ———>我就是直接复制的....
搜索如下:
VScode 是按照 工作区根目录 下的 .vscode 文件夹的路径作为绝对路径进行索引,如果工作区中里有许多文件夹,且文件夹内的文件需要引用当前目录下的文件,按照平常的方法写入相对路径是找不到文件的,这时候需要在 .vscode 文件夹里的 launch.json 文件中,在使用的调试环境中加入 "cwd": "${fileDirname}" 来指定调试从哪里去找文件,${fileDirname} 代表当前打开的文件所在的绝对路径,不包括文件名,这样设置后文件中就可以使用正常的相对路径来引入文件。
--————>现在2022年的vscode似乎已经将launch.json整合到了setting.json中去了。在configurations只加入一个 "cwd": "${fileDirname}" 是不行的,还有三个属性是必须的———>name request type 三个属性值
但是我加了之后还是不行。解决不了这个问题,达不到和老师一样的效果。
3.但是如果不用live server插件,直接在使用浏览器打开的话,绝对路径是可以的 相对路径不行 ,会报错 ——>net::ERR_FILE_NOT_FOUND
原因已经在上面了————> 原文链接https://blog.csdn.net/weixin_44560698/article/details/118520872
2022.4.13
跟着老师做小米的官网首页。———>发现一个意想不到的事情
因为老师的视频是之前的,小米的logo也是方方正正的,现在小米的logo改成了圆角,我为了和官网一致,使用了border-radius这个属性,我一开始设定的是百分比,但是怎么样都达不到一样的效果,查看官网的代码发现是使用的19px。学到了,原来还可以使用像素作为单位。已经不记得这个属性的大概用法了,果然复习还是有好处的。 然后悲剧的是,我突然想起来我这张图片是官网上直接下载下来的圆角的图片,而且是抠过图的。我只要把盒子的颜色设置为跟背景颜色一样的自然会是圆角的效果,根本不需要border-radius这个属性。
温故而知新————>
transition属性的值是必须是一个确定的值,ex:transition:left 0.3s 如果left是auto的话就不会生效。因为浏览器不知道auto的值是多少。需要加上left的具体值。
为何推荐使用 class 而不用 id 来定义样式
1、相对于class选择器,id选择器的权重实在太重了(100),这在一些项目中会造成灾难性的样式污染,以及权重陷阱。
2、id在文档内必须是唯一的,而样式很多具有复用性。
3、至于为什么大多数js使用id作为钩子,主要因为js通过id查询dom的速度是最快的。
4、其实class的诞生就是为了样式服务。id 更倾向于方便为脚本服务。
5、大公司的分工比较细,一般id是写js代码的人进行前端事件绑定使用的,如果写css的人将id改掉的时候,那么可能直接影响到了前端的交互效果。
2022.4.19
首行缩进 text-indent