HTML里面的div style是干什么用的?什么时候用DIV STYLE这个语法? STYLE是DVI的属性,它的值有哪些?

哎,2 02 2 年那会儿,我搞了个网站,想弄点样式,那时候也不懂,就看到个div,心想这玩意儿能干啥,后来一查,嘿,这div啊,就像网页上的一个骨架,你把内容往里一放,它就给你撑起来。
然后我又看到style,这玩意儿挺有意思,能改div的样儿,比如我想要个红色的边框,就这么写:
,这FF0000就是红色嘛。
style这东西,可多了,宽、高、背景、边框、居左、居右、边距,想怎么弄就怎么弄。
我当时也懵,后来才反应过来,这style.后面还有好多属性呢。
可能我偏激了点,但那时候就是觉得这东西挺神奇的。

怎么让网页的div永远固定在底部呢!

新建HTML文件。

写代码:


保存文件。

用Chrome打开。

滚动页面,div固定在底部。

HTML怎么使用div标签_HTMLdiv标签的语义化和布局应用方法说明

说实话,我刚开始搞前端的时候,对div那真是又爱又恨。
那时候写页面,Ctrl+C Ctrl+V一套模板,里面全是div套div,最后自己都看不懂。
现在想想,那时候的我们,可能有点偏激地觉得div万能,结果布局是出来了,但代码烂得跟一锅粥似的。

有意思的是,div标签本身确实没啥特别含义,它就像个通用的收纳箱,放啥都行。
我当年在一个旅游网站项目里用过,把景点介绍、图片、评价啥的都塞一个div里,最后CSS样式一加,效果是出来了,但同事回头想改评价部分,翻遍代码都找不着,因为根本不知道哪个div是干这活的。

后来HTML5 出了,各种语义化标签跟着全了。
说实话,刚开始用的时候挺不习惯,突然要给页面分区用
,脑子还得转:这玩意儿放这儿对不对?但用着用着发现,屏幕阅读器能正确读出页面结构了,SEO也好了,可读性直线上升。
我有个朋友做SEO的,他跟我说过,搜索引擎爬虫现在更喜欢语义化的标签,能更快理解页面重点。

说到布局,div确实功不可没。
我最近接手一个老项目,里面div嵌套得跟俄罗斯套娃似的,一问才知道,当年团队用Flexbox和Grid布局还不太熟,只能靠div堆。
现在重写的时候,我尽量用语义化标签,实在没合适的再放个div,配合CSS Grid重新排排坐。
比如现在流行的小红书那种卡片式布局,用Grid简直不要太方便,几行代码搞定,结构清晰,响应式也完美。

但要说最佳实践,我还是建议别滥用div。
我现在写代码,先问自己:有没有语义化标签能用?比如导航栏用