gpt4 book ai didi

javascript - 设计移动友好型网站的一些最佳实践是什么?

转载 作者:行者123 更新时间:2023-11-28 02:24:15 25 4
gpt4 key购买 nike

<分区>

对Java、Python、C等通用编程语言有丰富的经验,经常自学,熟悉四人组的Design-patterns。我最近一直在制作适合移动设备的网站,但是纵观我的解决方案,我可以肯定地表明我的前端开发技能不是很好,尽管找到了解决方案。我建议我不要实现最佳实践,我想找到一个可以提高我创建移动响应网站能力的地方。我阅读了很多 bootstrap4 框架,它对导航栏之类的东西有帮助,但是某些事情是不可能的。

例如,我网站最近的一个移动响应组件可以用这张图片来描述https://imgur.com/a/6SgaOVY

我解决的一般问题是创建一个带有图像、文本和箭头的全宽正方形。

对于桌面。按钮的宽度为 30%,img 位于左侧。对于移动设备,按钮的宽度为 100%,img 在上面,下面是文本,最后是按钮等...

为了解决这样的问题我用react和completed大致是这样

let result;

if (desktop){
result = /* 40 lines of html to create the solution for desktop */
} elif (mobile) {
result = /* Same 40 lines of html, button width change, html reordering
to move the image on top */
} else {
result = ...
}

{result}

如您所知,我基本上将每个案例的代码增加了三倍,发回给用户。到目前为止,我对移动响应式网站的唯一理解是使用@media 查询添加大量系列 css 条件语句。

我在通用编程语言方面拥有行业水平的经验,但到目前为止,我的大部分前端开发都是自学的。

我想找到任何信息源来教授创建高效、可读、编写良好的 css/html/js 的最佳实践,这些 css/html/js 用于创建移动友好的网站。

欢迎对我之前的代码示例发表评论以获取建议

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com