CSS——京东首页实战总结
第一天成果
1、浮动的盒子不要给宽,内容撑起盒子的宽
在前端设计中,一般不给浮动的盒子设置宽,让其用内容撑起一个高度。
2、小三角的表示
◇用一个盒子(盒子宽为字的宽,高度为字高度的一半)去截取这个菱形来得到一个三角,当然还要涉及到浮动。
3、块级元素只能通过padding-top来调节垂直居中
4、文字旁边的小图标
文字旁边的小图标是通过设置左右padding来给出一个空白,然后让图标进行绝对定位将图标加到文字的旁边。
第二天成果
CSS——京东首页实战总结的更多相关文章
- js 鼠标滚动到某屏时,加载那一屏的数据,仿京东首页楼层异步加载模式
js用处:在做商城时,首页图片太多,严重影响首页打开速度,所以我们需要用到异步加载楼层.js名称:鼠标滚动到某屏时,加载那一屏的数据,仿京东首页楼层模式js解释:1.用于商城的楼层内容异步加载,滚动条 ...
- 关于京东首页的制作以及切图软件fireworks推荐
这几天跟随老师给的视频学习制作京东首页 学到了很多 以下是相关代码和截图 html部分 <!DOCTYPE html><html lang="en">< ...
- jQuery仿京东首页广告图片切换图片轮播
1.效果图如下: 2.源码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charse ...
- CSS高效开发实战:CSS 3、LESS、SASS、Bootstrap、Foundation --读书笔记(1)设定背景图
技术的新发展,除计算机可以接入互联网之外,平板电脑.智能手机.智能电视等其他设备均可访问互联网.在多设备时代,构建多屏体验也不是听说的那么难. 但是这也增加了学习CSS的难度?不知道如何上手,只懂一点 ...
- js模仿京东首页的倒计时功能
模仿京东首页的倒计时 我们学习了定时器,可以用定时器做一个倒计时,于是我模仿了京东首页倒计时. 先看看京东首页的倒计时. 思路: 如何倒计时? 给一个未来的时间.然后计算未来时间到现在的时间戳. 用定 ...
- 京东首页原生----js制作|css动画|js动画|计时器--轮播图(好久没更新,这两天闲的蛋疼做个京东页面分辨率1366*768,919京东,适应没调!)要文件加关注找我要哦!
- HTML+CSS提升小实战
1 <html> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html ...
- html+css 百度首页练习
这几天看完了<css权威指南>,写了个百度页面,不带js的纯静态,主要目的就是掌握页面布局,字体颜色之类的没有深究. 写完了觉得很简单,毕竟一开始觉得只要模仿的像就行,但是缩小了浏览器窗口 ...
- IT兄弟连 HTML5教程 DIV+CSS网站首页布局示例
首页的设计直接影响网站的整体形象,虽然没有一个统一的规范,但最好将其设计为大众化的,只要信息内容能够合理地编排即可,使用户可以方便地找到需要的信息.另外,首页的高度最好不要超过三个屏幕,页面中使用的颜 ...
随机推荐
- css float 布局
.clearfix:after { content: ''; display: table; clear: both; } .clearfix {; }
- 前台改变asp button控件的值,后台取值没有改变的问题
前台: <asp:Button ID="btnEdit" Style="margin-left: 600px;" runat="server&q ...
- 概率好题 Light OJ 1027
题目大意:你在迷宫里,有n扇门,每个门有一个val,这个val可正可负,每次通过一扇门需要abs(x)分钟,如果这个门的val是正的,那么就直接出了迷宫,否则回到原地,问出去迷宫的期望是多少? 思路: ...
- ActiveX控件打包成Cab实现浏览器自动下载安装
前言 我们在浏览器中使用我们自己的一些OCX,或者是DLL这一类的文件,在X86的机器上需要我们手动将这些文件拷贝到Windows/System32 文件夹下面去,然后通过Dos命令regsvr32 ...
- WampServer 下载以及安装问题
WampServer 3.0 下载: http://dl.pconline.com.cn/download/52877-1.html 碰到的问题DDL无法添加,解决方法: http://jingyan ...
- hdu1950 Bridging signals 最长递增子序列
用一个数组记下递增子序列长度为i时最小的len[i],不断更新len数组,最大的i即为最长递增子序列的长度 #include<cstdio> #include<algorithm&g ...
- RING0,RING1,RING2,RING3
Intel的CPU将特权级别分为4个级别:RING0,RING1,RING2,RING3.Windows只使用其中的两个级别RING0和RING3,RING0只给操作系统用,RING3谁都能用.如果普 ...
- MP3拷贝程序---字节流
package cn.itcast.p7.io.bytestream.test; import java.io.BufferedInputStream; import java.io.Buffered ...
- iOS 常用代码块
1.判断邮箱格式是否正确的代码: // 利用正则表达式验证 -( BOOL )isValidateEmail:( NSString *)email { NSString *emailRegex ...
- C 汇编代码 函数调用指令和栈平衡
1. CALL指令: CALL指令可不是如唤指令,而是子程序调用指令.那么汇编语言中的子程序是什么呢?子程序能被其它程序调用,在实现某种功能后能自动返回到调用程序去的程序.其最后一条指令一定是返回指令 ...