youku首页01

今天尝试着写youku首页,第一次尝试完成一个整体的页面,感觉不难,而且自己也知道困难在于发现;

第一遍,因为没有写过整页,没有经验,所以一个一个元素往上加,边写htm,边写CSS,还顺便把js也写了,然而没多久就发现写不下去了,牵一发而动全身,这样写,得累死;

第二遍,开始先搭建整体html框架结构,然后往里面添加具体元素和CSS,一大块静态页面写完后,才加入js动态部分;整体思路清晰多了,也快了很多;然而,youku首页用的布局方式并不是响应时布局,而我在写的时候用了float这玩意儿,结果一缩放页面,变成响应时的了;一个悲剧的半成品;

第三遍明天再来吧,全部用position来布局;然而还有一个问题没有搞明白,youku首页只能缩小到50%,然后就不能继续缩小了,而我写的页面可以缩小到25%,这时候很多地方都会自动换行;很明显这个需要控制,只是需要查资料;不知道有没有高手能给点建议;

时间: 2024-10-06 12:33:29

youku首页01的相关文章

youku总结

好几天,断断续续的,把youku首页的各种结构和功能都实现了一遍,总结一下: 拒绝通配符:以前听别人说用通配符取消所有元素的边距不好,我没觉得什么,但是这次发现了一个问题,不知道是浏览器bug还是什么原因,当在一个元素的后代选择器中使用通配符以后,在后面单独设置其中一些元素的属性时会不起作用.比如被通配符设置了以后的h2,再想单独设置其样式就会无效:不明缘由,但是为防止这种事故,还是避免使用通配符的好: 反向选择器:以前没注意过这个选择器,但是这次在解决问题的时候使用了一下,确实很方便,尤其是在

html meta标签使用总结(转)

之前学习前端中,对meta标签的了解仅仅只是这一句. <meta charset="UTF-8"> 但是打开任意的网站,其head标签内都有一列的meta标签.比如我博客的. 但是自己却很不熟悉,于是把meta标签加入了寒假学习计划的最前方. 简介 在查阅w3school中,第一句话中的"元数据"就让我开始了Google之旅.然后很顺利的在英文版的w3school找到了想要的结果.(中文w3school说的是元信息,Google和百度都没有相关的词条.但

html meta标签使用总结

meta标签作用 META标签是HTML标记HEAD区的一个关键标签,提供文档字符集.使用语言.作者等基本信息,以及对关键词和网页等级的设定等,最大的作用是能够做搜索引擎优化(SEO). PS:便于搜索引擎机器人查找.分类,互联网应用应该要注意. 大网站都是怎么写? 在了解这个标签之前,我查找了各个主流网站他们的对于Meta的设置,如下: 京东首页的Meta设置: <meta charset="gbk"> <meta name="description&qu

HTML5的实用

p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px "PingFang SC"; color: #ffffff } p.p2 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px "PingFang SC"; color: #eb905a } p.p3 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px Menlo; color

HTML &lt;meta&gt; 标签,搜索引擎

关于Mate标签的详尽解释,请查看w3school 网址为:http://www.w3school.com.cn/tags/tag_meta.asp meta标签作用 META标签是HTML标记HEAD区的一个关键标签,提供文档字符集.使用语言.作者等基本信息,以及对关键词和网页等级的设定等,最大的作用是能够做搜索引擎优化(SEO). PS:便于搜索引擎机器人查找.分类,互联网应用应该要注意. 大网站都是怎么写? 在了解这个标签之前,我查找了各个主流网站他们的对于Meta的设置,如下: 京东首页

HTML meta 标签总结

本文转载自:http://www.cnblogs.com/lovesong/p/5745893.html meta标签作用 META标签是HTML标记HEAD区的一个关键标签,提供文档字符集.使用语言.作者等基本信息,以及对关键词和网页等级的设定等,最大的作用是能够做搜索引擎优化(SEO). PS:便于搜索引擎机器人查找.分类,互联网应用应该要注意. 大网站都是怎么写? 在了解这个标签之前,我查找了各个主流网站他们的对于Meta的设置,如下: 京东首页的Meta设置: <meta charset

关于meta标签使用总结[转载]

meta标签作用 META标签是HTML标记HEAD区的一个关键标签,提供文档字符集.使用语言.作者等基本信息,以及对关键词和网页等级的设定等,最大的作用是能够做搜索引擎优化(SEO). PS:便于搜索引擎机器人查找.分类,互联网应用应该要注意. 大网站都是怎么写? 在了解这个标签之前,我查找了各个主流网站他们的对于Meta的设置,如下: 京东首页的Meta设置: <meta charset="gbk"> <meta name="description&qu

手机H5移动端WEB资源整合之meta标签

一.相关网站使用meta的实例 youku首页的Meta设置: <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=Edge"> <meta name="title" content="优酷-中国领先视频网站,提供视频播放,视频发布,视频搜索 - 优酷视频" /> <meta n

我喜欢减肥我们来减肥吧

http://www.ebay.com/cln/honus.jyw4mvptb/cars/158313278016/2015.01.28.html http://www.ebay.com/cln/honus.jyw4mvptb/cars/158313282016/2015.01.28.html http://www.ebay.com/cln/honus.jyw4mvptb/cars/158313289016/2015.01.28.html http://www.ebay.com/cln/usli