html+css实现小米商城首页静态页面

学了一个星期的html和css,用新学的东西写点东西,仿照小米商城的首页按照它的页面布局盗用它的图片写了个小米商城的静态页面。

源代码:链接:https://pan.baidu.com/s/1qf63B6dBAUoDd6tpHFgESQ 密码:lwc5

  • 总结写前端时的不足:

    • css很多属性名记不住,经常需要去查笔记
    • 类名命名不是很规范
    • 没有充分利用css类的特性
    • 整个页面布局像是东拼西凑出来的(虽然拼凑的挺不错)
    • 暂时还没实现页面的动态效果,比如说轮播图,选项卡,鼠标放在某个a标签上的动态效果(等学了javascript再回过头来实现动态效果)
  • 总结:写前端更像是在‘织毛衣’,从上到下一点一点,一个div一个div的去写,去布局,没有逻辑。通过写这个页面加深了对html标签的使用以及对css元素属性的了解,知道了自己的不足以及后续编写其他页面需要注意的一些地方。

效果图

  • 顶部

  • 中间部分

  • 尾部

原文地址:https://www.cnblogs.com/wualin/p/10006875.html

时间: 2024-10-19 10:34:52

html+css实现小米商城首页静态页面的相关文章

用HTML+CSS实现一个计科院网站首页静态页面

链接:https://pan.baidu.com/s/1akwyc89q3nzKDQQulaFelQ 提取码:s6ys 原文地址:https://www.cnblogs.com/hzlshijie/p/10560255.html

京东首页静态页面

预览效果 index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0"> <title></title> <link

开发“小米商城官网首页”(静态页面)

一,项目题目:开发"小米商城官网首页"(静态页面) 二,项目需求 1.熟练运用所学知识还原小米商城官网首页静态页面 * 不需要做动态效果,只实现静态页面, 后期学完js再回来实现动态效果 三,项目布局 四,效果对比 目前的官网图片和小编做的图片对比 官网图片 小编做的效果图 五,代码附上 链接:https://pan.baidu.com/s/1EVyF8RIgRXFvEIHQf42Pow 密码:zqs4 index.html <!DOCTYPE html> <html

mvc伪静态&lt;四&gt; 伪静态后静态页面或者引用的css和图片失效

引用的css和图片失效的解决办法 把样式引用文件的相对路径改成绝对路径就可以了 比如原先的引用路径为:<link href="~/Content/css/style.css" rel="stylesheet" type="text/css" /> 改成:<link href="http://www1.lvyou.edushi.com/Content/css/style.css" rel="style

用手机自带uc浏览器查看静态页面,css样式不显示

问题描述: 这个问题是一个同事在写手机页面用UC浏览器测试以后遇到的,其他浏览器静态页面显示正常,唯独UC浏览器不显示页面样式. 我测试过代码是没有问题的,因为临时没有找到安卓手机,就猜想PC端的应该跟手机端会有同样的问题,毕竟是同样的内核嘛. 然而PC上用UC浏览器看或者自带的手机模拟器都没有任何问题,唯独手机上不行. 解决方法:如下图,审查元素发现,尼玛,居然UC浏览器默认给head加了一个dislay:none;隐藏属性,然后试着把引入的css文件放在head之外,就可以正常显示了. 不过

仿新浪首页、主题、详情页,纯html静态页面

仿新浪首页.主题.详情页,纯html静态页面,下载地址: http://download.csdn.net/detail/sweetsuzyhyf/8085535

只用table模仿一个静态页面

尝试只用table标签来模仿一个静态页面,这样做可以很好的增加对网页结构理解. 要尝试模仿的页面如下: 附上我自己写的代码,因为只是用了HTML,没有用到CSS和js,所以有些样式写出来和原图有些出入 <!DOCTYPE html> <html> <head> <title>只用table来模仿一个网页</title> <meta charset="utf-8"> </head> <body>

jekyll介绍安装.github静态页面工具

jekyll build # => 当前文件夹中的内容将会生成到 ./site 文件夹中. $ jekyll build --destination <destination> # => 当前文件夹中的内容将会生成到目标文件夹<destination>中. $ jekyll build --source <source> --destination <destination> # => 指定源文件夹<source>中的内容将会生

根据一个旅游网站的psd素材还原的静态页面

自学web前端的html.css和jquery两个月,想检验下自己的学习成果,遂从网上下了个关于旅游网站的psd素材,自己照着素材还原网站的静态页面. 这是我制作好的静态页面的压缩文件:旅游网站首页.rar 也附上psd文件的截图和制作好的页面在浏览器的截图 这是做好的页面截图: 这是psd文件的截图: