为了账号安全,请及时绑定邮箱和手机立即绑定

网页简单布局之结构与表现原则

江老实 Web前端工程师
难度初级
时长22分
学习人数
综合评分9.67
1416人评价 查看评价
9.8 内容实用
9.7 简洁易懂
9.5 逻辑清晰
个人觉得,该有的结构还是得有吧,虽然第三个代码的确简化了很多,但是这样的代码如果加上响应式,或者添加新的样式,则需要修改的地方太多,个人还是觉得整体还是要用div来体现结构和代码的可读性,毕竟当修改代码的时候人们大多数是通过你的div来确定修改的位置,第三个感觉个人制作比较实用,但是如果有后续的修改,会影响他人代码的阅读性
一上手就说了初级思维模式,就是我
觉得老师的思想,我们有一定的的印象就好了,毕竟学到这不得写的代码还好少,无法得心应手,所以优化先要有好的基础!
建议完全的新手不要看这个老师的视频了,这几个视频的做法是不是取巧我不评价,但是工作中用到的绝不能这么做,否则需求一改,你的页面几乎就要全部重新写了
现在很烦,没搞懂各种定位该如何用,结果看到这个视频,真想骂娘!要是这样取巧,我就不用研究定位了,所有东西都可以精确到像素的每个坐标。
div当然越少越好,但是有些情况下必须使用,那是没办法。基于这个例子老师说的第三种方法当然最简单。
呆毛1。。。。呆毛2.。。。。

已采纳回答 / qq_年少之时_0
<h5>标签可以设置背景图片,背景图片不会撑开,他会显示和<h5>标签高度相同一行图片。
一个切换,感觉结构都变化了呢,果然套模板才是最厉害的
刚学完html+css,然后来质疑这位老师的,你们所理解的前端就是写代码,排版页面的,觉得就是把所有元素放到它该在地方就完了?

naive。

代码写的越少越简单,网页的结构越简单,html和css的关联度越低,网页加载和渲染的速度就越快,0.01秒的差距就能直接决定用户体验。

不断优化用户体验就是前端存在的理由。
-------------------------
虽然我不太懂,不过这段话比较赞同
杨晓睿
老师一开始是怎样得出像素是多少的??
---------------------------------------
QQ的截图功能,在QQ后台运行的状态,直接快捷键 &quot;CTRL+ALT+A&quot; ,还有一个功能,可以采集鼠标所到之处的颜色RGB属性。
老师的意思是,结构的地方能少些就少些,用CSS代替就是高级网页编程?
img{width:95px; height:95px; padding:1px 20px 37px 30px;background:url(http://img1.sycdn.imooc.com//5385ac820001905201440133.jpg); margin:10px;}

已采纳回答 / Whitney_Wang
这道题里面那四张图片是一瓶香水(指甲油)加上一个大概95*95的白色背景,而给这几张图片加的背景是最后效果图中的花边和一个白色的大约95*95的框。不给图片加padding的时候,背景被图片挡住了,所以就显示图片。加了padding之后就显示一部分背景。如果按照题里面说的{}padding:1px 20px 37px 30px;},正好可以显示背景。如果把1px变成10px,那张背景就开始循环了,而且你的图片的白框和背景的白框就不重合了,所以上面多了一个白条,下面多了一个白条。希望我说明白了。。
课程须知
1.html+css简单的基础知识 2.有网页制作实战经验
老师告诉你能学到什么?
1.根据效果图能正确分解结构和表现 2. 能够深入理解网页结构与表现分离的思想

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

举报

0/150
提交
取消