仿写知乎页面小结

1.知乎页面的头部是浮动布局,一旦涉及到float就需要 清除浮动.

  css里用的是clearfix类:

  .clearfix:before, .clearfix:after {      .clearfix:after {

    display: table;              clear:both;

    content: "";              }

  }

    原理是在需要清除浮动的后面添加一个不占位置的标签,通过clear:both,使得添加的标签       上方不存在浮动元素(即在:after添加的标签上方制造空间,拉大父标签height)

    我犯了一个错误, .clearfix :before的冒号前面多打了一个空格,选择器的意义完全不一         样了,从具有clearfix类的标签 变成了 具有clearfix类的标签的所有子标签,导致显示错误。

2.待续

时间: 2024-12-06 17:34:19

仿写知乎页面小结的相关文章

怎么样仿写已知网址的网页?

今天上午在实验室里学习,无意中看到湖北老乡群里爆出了一则外包的消息. 是问有没有回搭建网站.我接了这单活儿.需求很简单,仿照这一个已知的网站做一个静态页面. 工作量不大.他说了,做一个静态网站.因为之前,我曾做过类似的工作,所以我就答应了. 遇到的第一个问题就是评价.他让我开个价.说实话,我当时也蒙了.这个外包估价这个事情,我之前也没做过.在网上搜了下,每个人说法都不一样.看到一个我觉得可以参考的回答.按照做的页面收费. 每个30~50.于是我给他报价是500,理由就是 大概做10个左右的页面,

仿写网易云-排行榜页面

第一次仿写页面(内心还是很鸡冻啊~~~) 还有很多地方没有完善 暂时就先这样吧 以后有机会在加效果 多练习 熟能生巧~ 好喜欢网易云音乐啊~音乐的天堂~希望以后自己也能去网易云工作就好了了~~~~~ 1 <!DOCTYPE html> 2 <html lang="zh-cn"> 3 <head> 4 <meta charset="utf-8"> 5 <meta http-equiv="X-UA-Comp

知乎首页的简单仿写

HTML(5)+CSS(3).静态页面仿写 Github链接:https://github.com/nebulium/ZhiHu 大概布局如下,在此布局基础上进一步处理. 切图:图片非高清,不过是非重点.在设计的时候使用到的chrome插件:屏幕尺子(page ruler)和color zilla取色工具. 布局总结:header为position:fixed,且z-index较大.mancolumn和sidebar部分考虑到并不会自适应,设置为position:absolute,这里注意统一用

仿写及比较标哥的iOS时钟动画

一.前言 以前看各种绚丽的UI特效动画代码,采用的方法是会先运行一篇,然后直接去看实现代码.初学时抱着瞻仰的态度去接触,去认识,是没有错的.但是在了解了像素.动画渲染机制,CoreAnimation API,推导过二维.三维的仿射矩阵之后,我们可以改变阅读UI动画博文或者是源码的方式了. Talk is cheap, show me the code——Linus Torvalds. 大量的仿写:一定一定要多写——叶孤城__ 在CodeReview线下大会上的发言. 最近安居客.猿题库.蘑菇街.

仿写一个简单的网站,以及初学前端的一点感悟

本文同时发布在本人个人博客上www.yaoxiaowen.com 这段时间在学习前端,并仿着我们公司官网的设计 tongshai.net, 把官网重新实现了一遍. 主要是因为我们公司的官网设计很简单(就几个静态页面,连什么控件都没用),很适合作为练手项目, 模仿的工程放在了我的另一个测试服务器上. 点击查看. 在仿写过程中,因为网页很简单,所以也没有碰到过什么很纠结的技术问题.仿写一下也就是熟悉一下相关概念. 但是按照我的前端同事的建议,使用了bootstrap 框架,快速浏览了一下这个框架的教

使用原生js仿写win10时钟

学习web前端已经一月了,突然就像做一点什么,于是就仿写了一个win10时钟(农历计算准确度太差,于是就忽略不写了~~) 一.HTML布局 1 <div class="wrap"> 2 <div class="time-present"> 3 <div class="time-local"> 4 <span id="hours">13</span><span&g

ASP.NET WebAPI 14 仿写Filter管道

WebAPI中有设计了几种管道(Channel),大概如下:HttpMessageHandler,ActionFilter管道,ExceptionFilter管道.在三种管道中HttpMessageHandler管道与ExceptionFilter管道是基于级别设计的,ActionFilter管道是基于方法级别设计的.对于ActionFilter管道,因为采用的是AOP的思想,所以按方法级别去设计. 在看WebAPI源码过程中对ActionFilter管道中何用的表达示树与闭包等内容之前并没有下

读取本地图片写到jsp页面

//读取本地图片写到jsp页面 File file = new File("D:/parking/A区12号.jpg"); ServletOutputStream out = null; InputStream in = null; try { in = new FileInputStream(file); response().setContentType("multipart/form-data"); int tempbyte; out = response()

礼物说仿写项目iOS源码

礼物说仿写(updating...) 源码下载:http://code.662p.com/view/14507.html api: 礼物说 首页精选 banner2: http://api.liwushuo.com/v2/secondary_banners?gender=1&generation=2 banner1: http://api.liwushuo.com/v2/banners?channel=iOS 精选: http://api.liwushuo.com/v2/channels/101