# css实现等高布局
页面写多了，难免就会遇到需要实现等高布局的方式。下面讲讲实现等高布局的三种方式。
# 第一种使用table-cell实现(兼容IE8)
.table-row-layout {
/* 当元素display设置为table-row后，再设置宽度就没有效果了，因此需要再包裹一层div，然后给它设置宽度 */
display: table-row;
.table-cell-layout {
display: table-cell;
width: 33.33%;
padding: 10px;
border: 1px solid #ccc;
border-left: none;
}
.table-cell-layout:first-child {
border-left: 1px solid #ccc;
}
}
# 第二种使用flex布局实现
.flex-layout {
display: flex;
width: 100%;
.flex-item {
width: 33.33%;
padding: 10px;
border: 1px solid #ccc;
border-left: none;
}
.flex-item:first-child {
border-left: 1px solid #ccc;
}
}
# 第三种利用margin实现等高布局(实际开发中不建议使用)
.marign-layout {
width: 100%;
overflow: hidden;
border-bottom: 1px solid #ccc; //item的边框被overflow隐藏了，所以需要自己补上，不易用，不推荐
.item {
float: left;
width: 30%;
padding: 10px;
margin-bottom: -9999px;
padding-bottom: 9999px;
border: 1px solid #ccc;
border-left: none;
}
.item:first-child {
border-left: 1px solid #ccc;
}
}
使用table-cell实现(兼容IE8)
- 我们过了江，进了车站。我买票，他忙着照看行李。行李太多，得向脚夫行些小费才可过去。他便又忙着和他们讲价钱。我那时真是聪明过分，总觉他说话不大漂亮，非自己插嘴不可，但他终于讲定了价钱；就送我上车。他给我拣定了靠车门的一张椅子；我将他给我做的紫毛大衣铺好座位。他嘱我路上小心，夜里要警醒些，不要受凉。又嘱托茶房好好照应我。我心里暗笑他的迂；他们只认得钱，托他们只是白托！而且我这样大年纪的人，难道还不能料理自己么？我现在想想，我那时真是太聪明了
- 我说道：“爸爸，你走吧。”他往车外看了看，说：“我买几个橘子去。你就在此地，不要走动。”我看那边月台的栅栏外有几个卖东西的等着顾客。走到那边月台，须穿过铁道，须跳下去又爬上去。父亲是一个胖子，走过去自然要费事些。我本来要去的，他不肯，只好让他去。我看见他戴着黑布小帽，穿着黑布大马褂，深青布棉袍，蹒跚地走到铁道边，慢慢探身下去，尚不大难。可是他穿过铁道，要爬上那边月台，就不容易了。他用两手攀着上面，两脚再向上缩；他肥胖的身子向左微倾，显出努力的样子。这时我看见他的背影，我的泪很快地流下来了。我赶紧拭干了泪。怕他看见，也怕别人看见。我再向外看时，他已抱了朱红的橘子往回走了。过铁道时，他先将橘子散放在地上，自己慢慢爬下，再抱起橘子走。到这边时，我赶紧去搀他。他和我走到车上，将橘子一股脑儿放在我的皮大衣上。于是扑扑衣上的泥土，心里很轻松似的。过一会儿说：“我走了，到那边来信！”我望着他走出去。他走了几步，回过头看见我，说：“进去吧，里边没人。”等他的背影混入来来往往的人里，再找不着了，我便进来坐下，我的眼泪又来了。
- 近几年来，父亲和我都是东奔西走，家中光景是一日不如一日。他少年出外谋生，独力支持，做了许多大事。哪知老境却如此颓唐！他触目伤怀，自然情不能自已。情郁于中，自然要发之于外；家庭琐屑便往往触他之怒。他待我渐渐不同往日。但最近两年不见，他终于忘却我的不好，只是惦记着我，惦记着我的儿子。我北来后，他写了一信给我，信中说道：“我身体平安，惟膀子疼痛厉害，举箸提笔，诸多不便，大约大去之期不远矣。”我读到此处，在晶莹的泪光中，又看见那肥胖的、青布棉袍黑布马褂的背影。唉！我不知何时再能与他相见！
使用flex布局实现
- 燕子去了，有再来的时候；杨柳枯了，有再青的时候；桃花谢了，有再开的时候。但是，聪明的，你告诉我，我们的日子为什么一去不复返呢？——是有人偷了他们罢：那是谁？又藏在何处呢？是他们自己逃走了罢：如今现在又到了哪里呢？
- 我不知道他们给了我多少日子，但我的手确乎是渐渐空虚了。在默默里算着，八千多日子已经从我手中溜去，像针尖上一滴水滴在大海里，我的日子滴在时间的流里，没有声音，也没有影子。我不禁头涔涔而泪潸潸了。
- 去的尽管去了，来的尽管来着；去来的中间，又怎样地匆匆呢？早上我起来的时候，小屋里射进两三方斜斜的太阳。太阳他有脚啊，轻轻悄悄地挪移了；我也茫茫然跟着旋转。于是——洗手的时候，日子从水盆里过去；吃饭的时候，日子从饭碗里过去；默默时，便从凝然的双眼前过去。我觉察他去的匆匆了，伸出手遮挽时，他又从遮挽着的手边过去，天黑时，我躺在床上，他便伶伶俐俐地从我身上跨过，从我脚边飞去了。等我睁开眼和太阳再见，这算又溜走了一日。我掩着面叹息。但是新来的日子的影儿又开始在叹息里闪过了。
利用margin实现等高布局(实际开发中不建议使用)
- 一谈到读书，我的话就多了!我自从会认字后不到几年，就开始读书。倒不是4 岁时读母亲教给我的商务印书馆出版的国文教科书第一册的“天，地，日，月，山，水，土，木”以后的那几册，而是7 岁时开始自己读的“话说天下大势，分久必合，合久必分……”的《三国演义》! 那时我的舅父杨子敬先生每天晚饭后必给我们几个表兄妹讲一段《三国演义》，我听得津津有味，什么“宴桃园豪杰三结义，斩黄巾英雄首立功”，真是好听极了，但是他讲了半个钟头，就停下去干他的公事了。我只好带着对于故事下文的无限悬念，在母亲的催促下，含泪上床。 此后我决定咬了牙拿起一本《三国演义》来，自己一知半解地读了下去，居然越看越懂，虽然字音都读得不对，比如把“凯”念作“岂”，把“诸”念作“者”之类，因为就只学过那个字一半部分。 谈到《三国演义》我第一次读到关羽死了，哭了一场，便把书丢下了。第二次再读时，到诸葛亮死了，又哭了一场，又把书丢下了，最后忘了是什么时候才把全书读到分久必合的结局。
- 这时就同时还看了母亲针钱箩里常放着的那几本《聊斋志异》，聊斋故事是短篇可以随时拿起放下，又是文言的，这对于我的作文课，很有帮助，时为我的作文老师曾在我的作文本上，批着“柳州风骨，长吉清才”的句子，其实我那时还没有读过柳宗元和李贺的文章，只因那时的作文，都是用文言写的。 因为看《三国演义》引起了我对章回小说的兴趣，对于《水浒传》大加欣赏。那部书里着力描写的人物，如林冲——林教头风雪山神庙一回，看了使我气愤填胸!武松、鲁智深等人，都有其自己极其生动的风格，虽然因为作者要凑成36 天罡72 地煞勉勉强强地满了一百零八人的数目，我觉得也比没有人物个性的《荡寇志》强多了。 《精忠说岳》并没有给我留下太大的印象，虽然岳飞是我从小就崇拜的最伟大的爱国英雄。在此顺便说一句，我酷爱古典诗词，但能够从头背到底的，只有岳武穆的《满江红》“怒发冲冠”那一首，还有就是李易安的《声声慢》，她那几个叠字：“寻寻，觅觅，凄凄，惨惨，戚戚……”写得十分动人，尤其是以“寻寻觅觅”起头，描写尽了“若有所失”的无聊情绪。到得我11 岁时，回到故乡的福州，在我祖父的书桌上看到了林琴南老先生送给他的《茶花女遗事》，使我对于林译外国小说，有了广泛的兴趣，那时只要我手里有几角钱，就请人去买林译小说来看，这又使我知道了许多外国的人情世故。 《红楼梦》是在我十二三岁时候看的，起初我对它的.兴趣并不大，贾宝玉女声女气，林黛玉的哭哭啼啼都使我厌烦，还是到了中年以后，再拿起这部书看时，才尝到“满纸荒唐言，一把辛酸泪”，一个朝代和家庭的兴亡盛衰的滋味。
- 总而言之，统而言之，我这一辈子读到的中外的文艺作品，不能算太少。我永远感到读书是我生命中最大的快乐!从读书中我还得到了做人处世的“独立思考”的大道理，这都是从“修身”课本中所得不到的。 我自1980 年到日本访问回来后即因伤腿，闭门不出，“行万里路”做不到了，“读万卷书”更是我唯一的消遣。我每天都会得到许多书刊，知道了许多事情，也认识了许多人物。同时，书看多了，我也会挑选，比较。比如说看了精彩的《西游记》就会丢下烦琐的《封神传》，看了人物如生的《水浒传》就不会看索然乏味的《荡寇志》，等等。对于现代的文艺作品，那些写得朦朦胧胧的，堆砌了许多华丽的词句的，无病而呻，自作多情的风花雪月的文字，我一看就从脑中抹去，但是那些满带着真情实感，十分质朴浅显的篇章，那怕只有几百上千字，也往往使我心动神移，不能自己! 书看多了，从中也得到一个体会，物怕比，人怕比，书也怕比，“不比不知道，一比吓一跳。” 因此，有某年的六一国际儿童节，有个儿童刊物要我给儿童写几句指导读书的话，我只写了几个字，就是： 读书好，多读书，读好书。
项目实战
计费方式
计费区域
首重
（千克）
（千克）
运费
（元）
（元）
续重
（千克）
（千克）
续费
（元）
（元）
按重量计费
内蒙古 、 西藏 、 甘肃 、 青海 、 宁夏 、 新疆
1
￥23.00
1
￥6.00
免邮区域
四川 、海南 、贵州 、云南 、陕西 、黑龙江 、江苏 、山东 、安徽 、浙江 、福建 、湖北 、湖南 、广东 、北京 、上海 、天津 、重庆 、河北 、山西 、河南 、辽宁 、吉林 、广西 、江西 、
不配送区域
新疆、西藏、内蒙古、黑龙江
# 总结
下次遇到需要实现等高布局的就可以来这参考一下啦。微信公众号【爆米花小布】等你来关注。