简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
首页 > web前端 > html教程 > 正文

CSS如何实现网易的盖楼效果_html/css_WEB-ITnose

WBOY
发布： 2016-06-24 11:41:18
原创
1244 人浏览过

CSS如何实现网易的盖楼效果:
建议:尽可能的手写代码，可以有效的提高学习效率和深度。
在很多论坛性质或者回复功能的网站都有盖楼效果，就是回复与回复之间能够叠加，这个感觉比较人性化，没有体验过这样的效果的朋友可以去网易找一个比较火热的帖子看一下它的回复就明白了。下面就介绍一下如何实现此种功能，代码实例如下:

<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="author" content="http://www.51texiao.cn/" /><title>蚂蚁部落</title><style type="text/css">* {  margin:0px;  padding:0px;}#wrap{width:500px;}.box {  margin-bottom:12px;  overflow:hidden;  padding:3px;  background:#FFFFEE;  border:solid 1px #999;}</style></head><body><div id="wrap">  <div class="box">    <div class="box">      <div class="box">        <div class="box">          <div class="box">            <div class="box">              <div class="box">                <div class="box">                  <div class="box">我是楼主</div>                  我是二楼 </div>                我是三楼 </div>              我是四楼 </div>            我是五楼 </div>          我是六楼 </div>        我是七楼 </div>      我是八楼 </div>    我是酒楼 </div></div></body></html>
登录后复制

原文地址是:http://www.51texiao.cn/div_cssjiaocheng/2015/0501/512.html

相关标签：
CSS如何实现网易的盖楼效果
来源：php.cn
上一篇：css3.0新增属性学习_html/css_WEB-ITnose 下一篇：CSS中的:after和:before的作用是什么_html/css_WEB-ITnose
本站声明
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
使用SCSS生成默认值和CSS变量 我正在实现网站样式。出于遗留支持的原因，我需要支持IE11，至少一段时间。出于工作流程和我的理智原因，我想尽可能使用css变量。我已经研究过这个解决方案，它会生成一些有效的东西，但...
来自于 2024-04-06 17:46:54
0
1
355
创建一个悬停效果，将菜单按钮转换为具有阴影克隆版本的 x 形状 首先我想承认我的标题很令人困惑，对此感到抱歉。我想要实现的是悬停时的以下效果：我的网站在这里https://wordpress-493302-3130963.cloudwaysap...
来自于 2024-04-04 11:55:21
0
2
315
相关专题
更多>
热门推荐
热门教程
更多>
相关教程
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网：公益在线PHP培训，帮助PHP学习者快速成长！