qq_33359745
N_ora
采纳率80%
2020-08-29 20:25

大家都是如何通过仿写网页提高网页编写能力的呢?

10
已采纳

本人目前html、css 常用的布局基本掌握,也看视频(但发现视频基本没有不考虑兼容适配)做过一些页面,但是仍旧满脑子都是问号。希望有大神指点一下迷津。

下面问题主要都是针对pc端页面自适应手机端。

1.对于网页的兼容方面
目前工作的话一般会要求兼容到什么版本的浏览器呢(很多要求的是主流浏览器,感觉不是很详细),在网上也搜过兼容相关的资料,但是好像都是很零碎的帖子(讲了reset样式,浏览器前缀,选择器前缀还有ie的条件判断),但可能因为没有完整的梳理,还是觉得很蒙,**请问是否有系统一些的书籍推荐?**

2.关于不同自适应方面,用float及百分比做布局在缩放屏幕大小时总会出问题(比如在ie7或者8时会掉下来),如果**用媒体查询又应该是以哪几个屏幕宽度作为分界点**,是参考bootstrap的媒体查询吗?

3.因为觉得布局自己还需要更加熟练一些,但是不知道**如何通过仿网页提高
编写页面能力**,是就看着页面不看代码,自己实现页面布局?还是跟着源代码敲,研究为什么这么写(发现有好些代码看不懂为啥那样写,作用是啥) (之前仿写网站都是自己根据内容布局自己写,基本实现页面)哪个方法会有用点呢?

4.目前pc端是否还是用div比较多?移动端用h5比较多呢?

求过路大神救救我的脑子吧!感谢!

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

4条回答

  • qq_36553707 bdy_无解 7月前

    对于网页兼容性问题,一般就只考虑ie8及以上的问题就行了,其他的浏览器一般都会要求用户更新到最新版本

    自适应网页,我理解的,一般称之为响应式布局,在css中使用@media这样一个标签,具体的话可以去bilibili上面看看相关视屏教程
    这里推荐一个视频https://www.bilibili.com/video/BV1eJ411e7cA,可以参考

    bootstrap是一个CSS框架,是别人写好的css样式,你直接拿来使用,bootstrap中有媒体查询这部分内容,单独使用float和百分比布局做自适应
    是很难实现的,曾经有段时间,我也陷入了这个误区,一般都会用到媒体查询,分屏的话一般也是更具需求来做,没有啥特别的要求

    提高网页编写能力还是很简单的,首先,对于一个新页面,你需要懂网页布局,然后根据布局思路进行敲代码,遇到问题可以去菜鸟或者W3C上面
    看看参考手册,参考手册写的还是很详细的,等你觉得这种方式没问题的时候,再去看看别人的代码,来提高自己,做网页要学会自己对网页内容
    进行切割,将一个大的矩形切割成无数小的矩形,然后将小矩形拼成一个大的矩形,这是我的思路,可以参考

    对于布局来说,你喜欢用什么样的标签都可以,不一定是用div,div标签是类似于一个容器,一般习惯对这个容器进行样式编辑,DIV+CSS写页面
    应该就是这样来的

    以上均来自于个人观点,仅供参考,毕竟我也是个菜鸟,哈哈

    点赞 评论 复制链接分享
  • weixin_41969959 weixin_41969959 7月前

    你想考虑电脑端的以前老版本的话,不要用到html5和css3上的东西,现在的手机端和pc的浏览器以上说的加前缀都能解决,只有你能准确理解盒子模型,定位,边框清除问题等和@media,bootstrap是可以用的,但bootstrap3之前包括bootstrap3的版本手机端字体问题根本就没有解决,不写响应样式的话不建议使用,你页面慢的问题,建议先把很多常用的小的模块先写好,以后网页的时候差不多的模块可以拿来用,稍微修改下就行。

    点赞 评论 复制链接分享
  • qq_37049128 菜鸟咸鱼一锅端 7月前

    主要还是解决ie8一下的兼容吧

    主要是js兼容和css兼容(内核,比如盒模型和怪异盒模型)

    能不用浮动就不要用了,媒体查询主要是(1920,1680,1440,1280)几个

    自己实践可能更直观点,理论加实践才知道为什么这样做

    目前pc端是否还是用div比较多?移动端用h5比较多呢?你这问题真的,难道pc端不是H5页面?

    点赞 评论 复制链接分享
  • caozhy 回答这么多问题就耍赖把我的积分一笔勾销了 7月前

    现在ie、ff基本都被边缘化了,chrome,webkit实际上已经占领了全部的份额。现在再学 css hack 基本浪费时间。
    实际上,抄网页这种事情很low,现在的机器学习算法,已经可以很好地将切图转换成语义精确的html/css。你去学习能被机器替代的东西,没有前途。
    前途在于,对web标准的理解,对于js和前端框架的理解,以及和后端的交互,全栈的知识。

    点赞 评论 复制链接分享