目录: 1.首页项目结构 2.通用样式抽取 3.结构与样式 4.顶部广告 5.顶部通栏结构 6.顶部通栏样式 7.搜索结构搭建 8.搜索样式 9.导航结构 10.导航样式 11.轮播图大结构 12.轮播图左侧 13.轮播 ...
学了一个星期的html和css,用新学的东西写点东西,仿照小米商城的首页按照它的页面布局盗用它的图片写了个小米商城的静态页面。 源代码:链接:https: pan.baidu.com s qf B dBAUoDd tpHFgESQ 密码:lwc 总结写前端时的不足: css很多属性名记不住,经常需要去查笔记 类名命名不是很规范 没有充分利用css类的特性 整个页面布局像是东拼西凑出来的 虽然拼凑的 ...
2018-11-23 12:46 1 6175 推荐指数:
目录: 1.首页项目结构 2.通用样式抽取 3.结构与样式 4.顶部广告 5.顶部通栏结构 6.顶部通栏样式 7.搜索结构搭建 8.搜索样式 9.导航结构 10.导航样式 11.轮播图大结构 12.轮播图左侧 13.轮播 ...
注意事项 一、CSS的定位问题position static 没有定位,遵循正常的文档流对象。 以下使用较多 fixed 相对于浏览器窗口是固定的,窗口的他不会移动(比如说百度弹出来的登录窗口,不会移动) relative相对定位元素的定位是相对其正常位置,相对定位元素经常被用来作为绝对定位 ...
思路: 首先观察我校计科院网站首页,按F12观察它的各个板块的布局。 然后用<div>从上到下从左到右一块一块仿照着来实现。 需要用到的图片全都从原本网站上保存下来使用。 效果: HTML代码(CSS全采用内部引用 ...
一、小项目说明 这是个例行的小项目练习,主要利用html和css的基础知识,复刻一个缩减版的小米商城网页。包括【导航栏】、【头部logo区,快捷键、搜索框】、【网页主体】、【网页尾部】几个部分。目前只实现静态的网页显示。最终效果图如下: 二、程序框架 按照开发规范 ...
开发”小米商城官网首页”(静态页面) <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>小米商城 - 小米MIX 3、红米 ...
一,项目题目:开发”小米商城官网首页”(静态页面) 二,项目需求 1.熟练运用所学知识还原小米商城官网首页静态页面 * 不需要做动态效果,只实现静态页面, 后期学完js再回来实现动态效果 三,项目布局 四,效果对比 目前的官网图片和小编做的图片对比 ...
作业题目:开发”小米商城官网首页”(静态页面) 作业需求: 基础需求:85%1.熟练运用所学知识还原小米商城官网首页静态页面2. html页面代码书写规范3. 程序有相应的目录划分(比如:存放css的文件,存放js的文件)4. html页面没有不能出现大量的css样式代码5. 页面的展示效果 ...
头部信息编写 淘宝图: 一、涉及知识 1、自定义图标(字体) 2、左右浮动 3、列表制作导航栏 4、鼠标指向超链接改变颜色 5、CSS的@规则 二、代码 1、index.html: 2、reset.css(样式重置 ...