Rumah > hujung hadapan web > html tutorial > 求移动端一个这样的表格该怎样做_html/css_WEB-ITnose

求移动端一个这样的表格该怎样做_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Lepaskan: 2016-06-24 11:31:38
asal
1444 orang telah melayarinya

要自适应屏幕div+css 是h5
横着40%、60% 右边上下80%、20%


回复讨论(解决方案)

那你直接写啊
左面div 40%宽度 右面div 60%宽度

最前面加这个样式

那你直接写啊
左面div 40%宽度 右面div 60%宽度

最前面加这个样式

主要就是右边那个大层里几个小的怎么写

不会用div就用table套table吧 也是可以的

不会用div就用table套table吧 也是可以的

table我会 就是想换成css+div提高性能

.maxdiv {            width:100%;            height:400px;            border:1px red solid;        }        .leftdiv {            width: 39%;            height: 400px;            border:1px black solid;            float:left;        }        .rightdiv {            width: 59%;            height: 400px;            border: 1px blue solid;            float: left;        }        .rightdiv .rightdiv_top {            width:100%;            border:1px green solid;            height:80%;        }            .rightdiv .rightdiv_bottom {                width: 100%;                border: 1px red solid;                height: 20%;            }                .rightdiv .rightdiv_bottom .left {                    width: 29%;                    border: 1px red solid;                    height: 100%;                    float: left;                }                .rightdiv .rightdiv_bottom .middle {                    width: 38%;                    border: 1px red solid;                    height: 100%;                    float: left;                }                .rightdiv .rightdiv_bottom .right {                    width: 29%;                    border: 1px red solid;                    height: 100%;                    float: left;                }
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

.maxdiv {            width:100%;            height:400px;            border:1px red solid;        }        .leftdiv {            width: 39%;            height: 400px;            border:1px black solid;            float:left;        }        .rightdiv {            width: 59%;            height: 400px;            border: 1px blue solid;            float: left;        }        .rightdiv .rightdiv_top {            width:100%;            border:1px green solid;            height:80%;        }            .rightdiv .rightdiv_bottom {                width: 100%;                border: 1px red solid;                height: 20%;            }                .rightdiv .rightdiv_bottom .left {                    width: 29%;                    border: 1px red solid;                    height: 100%;                    float: left;                }                .rightdiv .rightdiv_bottom .middle {                    width: 38%;                    border: 1px red solid;                    height: 100%;                    float: left;                }                .rightdiv .rightdiv_bottom .right {                    width: 29%;                    border: 1px red solid;                    height: 100%;                    float: left;                }
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk


因为边框占了宽度所以宽的百分比有点调整


.maxdiv {            width:100%;            height:400px;            border:1px red solid;        }        .leftdiv {            width: 39%;            height: 400px;            border:1px black solid;            float:left;        }        .rightdiv {            width: 59%;            height: 400px;            border: 1px blue solid;            float: left;        }        .rightdiv .rightdiv_top {            width:100%;            border:1px green solid;            height:80%;        }            .rightdiv .rightdiv_bottom {                width: 100%;                border: 1px red solid;                height: 20%;            }                .rightdiv .rightdiv_bottom .left {                    width: 29%;                    border: 1px red solid;                    height: 100%;                    float: left;                }                .rightdiv .rightdiv_bottom .middle {                    width: 38%;                    border: 1px red solid;                    height: 100%;                    float: left;                }                .rightdiv .rightdiv_bottom .right {                    width: 29%;                    border: 1px red solid;                    height: 100%;                    float: left;                }
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk


因为边框占了宽度所以宽的百分比有点调整 如果我要是在左边加个图片 能让它不超过左边层的大小么
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan