html网页左图右文

weixin_41357645 2017-12-12 07:38:24

怎么把它变成左图右文左图右文

...全文

1284 6 打赏收藏转发到动态举报

写回复

6 条回复

切换为时间正序

请发表友善的回复…

发表回复

daydayUp. 2017-12-15

打赏
举报

回复

左边加入 float:left 右边加入 overflow:hidden

weixin_41357645 2017-12-13

打赏
举报

回复

okok 搞定了

阿弥陀佛@么么哒 2017-12-13

打赏
举报

回复

子元素浮动，父元素必须加高度，或者给父元素添加overflow属性

weixin_41357645 2017-12-13

打赏
举报

回复

哪里出问题了

whidy 2017-12-13

打赏
举报

回复

看图片貌似你已经实现了你需要在每一个左图右文的包裹标签内尾部插入一个清除浮动的标签. 或者直接给包裹块加一个overflow:hidden;的样式

本文实例讲述了CSS实现左图右文混排布局的方法。分享给大家供大家参考。具体分析如下： CSS图文混排是我们布局网页时经常要用到的布局方法，本实例就是一个典型的左图右文的常用布局，美观大方，方法简便，你可以运行一下代码，看下效果，是不是你想要的呢？复制代码代码如下:<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”><html xmlns=”www.w3.org/1999/xhtml”><head><title>CSS左

CSS图文混排是我们布局网页时经常要用到的布局方法，本实例就是一个典型的左图右文的常用布局，美观大方，方法简便，你可以运行一下代码，看下效果，是不是你想要的呢？复制代码代码如下:CSS左图右文混排布局* {margin:0;padding:0;}h3 {font-size:12px;color:#0066CC;line-height:2em;}p {font-size:12px;text-inde...

new document * {margin:0;padding:0;}img {height:100px;width:100px;border:1px solid #ccc;padding:2px;}h3 {font-size:12px;color:#09c;line-height:2em;}p {font-size:12px;text-indent:2em;line-height:1.5em...

应该有不少小伙伴在平时在使用各种APP阅读新闻资讯时遇到过这样的问题：同样是新闻资讯类的APP，为什么有些的布局是左文右图，而有些则是左图右文？刚开始发现这个问题的时候自己也比较困惑，便和一些设计伙伴进行讨论，也在网上查看了其他人的理解。当中不少人认为这样的差异是因为不同新闻平台侧重点不一样，像今日头条侧重的是保证用户阅读信息的流畅性便采用左文右图的布局，而网易则想让用户更加注重深度阅读，同时图片...

CSS布局-www.mb5u.com*{margin:0;padding:0;border:0; list-style:none}body{background:white;}.event{ width:442px;height:90px; margin:5px; clear:both; border:1px white solid; }.event .pic{ float:left;margi...

61,112

社区成员

60,730

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章