前端HTML+CSS复习

学完了canvas,本来想去系统学3D的,但是转念一想,还是先去复习HTML+CSS吧。

不看不知道,系统学的,跟我这种想一出是一出的学习方式还是有很多区别的。

还是那句话:

翻烂一本书,胜过敲键盘。

今天才发现这么多有意思的、很多课程不会告知的小细节,那么现在咱们一起唠唠吧。

1.某个网站的404页面,自动跳转到指定位置。

我以前一直以为这个功能的实现必须要配合JS来使用,但是没想到,居然还有一种很古早的方式:

使用meta属性

只能是,学海无涯啊。

怎么实现?

<meta http-equiv="refresh" content="时间;路径">

把这句话加入到HTML文件的head标签里面即可。

对了,http-equiv的值不能用replace,要不然无效。

content里面直接写时间即可,不需要加单位,路径一般都是相对路径。

为什么要相对路径?

这跟网站上线是有很大关联的,就不展开说了。

但实际上,很多时候都需要配合倒计时来使用的,比如说提示用户多少秒之后跳转,所以这个被优化掉是有道理的。

2.网络卡的时候,HTML结构先展示出来

这也是我一直没搞懂的地方,现在很多小程序都是这么做的。

先展示结构,再去做内容替换或者是CSS的覆盖。

我们知道CSS的加载方式有三种:

外联式

内联式

行内式

!important就少用吧。

但实际上,还有一种很少人用的东西:

@import

突然想起,这™不是Java吗?

好熟悉的感觉,又回到了痛苦的Java学习路程,想起来我也很久没写Java了。。。

不知道以后有没有机会继续深耕前端行业了。

@import和link都是外联式的一种。

两者最大的区别,就在于加载的顺序。

@import是先加载HTML再加载CSS,而link则恰好相反,先加载CSS再加载HTML。

所以网络卡的时候,你就可以大概猜出这个网址是先加载什么的了。

无聊的知识又增加了,真的好棒呢。

别的暂时没想到有啥,遇到了再说吧。


对了,为了语义化、SEO等因素,看看一些基础知识还是必须要去看的。

比如说,table里面的thead、tbody、tfoot是有语义的,但是它们有没有对于表格的展示来说,其实都没有太大关系。

也就是说,写不写对于展示都没有任何问题。

But,

代码是给浏览器看的,语义化好的网页,才能更好地被浏览器读懂,减少代码量。

最重要的是------SEO的优化。

SEO才是前端开发的最后选择吗?

再比如说,我以前使用input来做单选,搞不懂name是什么意思。

直到去翻书了,才知道name有多大作用,少了个name简直是要老命了。

在看书的过程中,突然把我之前学的,全部串起来了。

Node.js中的form为什么要用method、为什么要用action......

相关推荐
糕冷小美n7 小时前
elementuivue2表格不覆盖整个表格添加固定属性
前端·javascript·elementui
小哥不太逍遥7 小时前
Technical Report 2024
java·服务器·前端
沐墨染8 小时前
黑词分析与可疑对话挖掘组件的设计与实现
前端·elementui·数据挖掘·数据分析·vue·visual studio code
anOnion8 小时前
构建无障碍组件之Disclosure Pattern
前端·html·交互设计
threerocks8 小时前
前端将死,Agent 永生
前端·人工智能·ai编程
问道飞鱼9 小时前
【前端知识】Vite用法从入门到实战
前端·vite·项目构建
爱上妖精的尾巴9 小时前
8-10 WPS JSA 正则表达式:贪婪匹配
服务器·前端·javascript·正则表达式·wps·jsa
Aliex_git10 小时前
浏览器 API 兼容性解决方案
前端·笔记·学习
独泪了无痕10 小时前
useStorage:本地数据持久化利器
前端·vue.js
程序员林北北10 小时前
【前端进阶之旅】JavaScript 一些常用的简写技巧
开发语言·前端·javascript