<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

<style type="text/css">

#hunpai{

    width:500px;

    height:400px;

    border:2px dashed orange;

    padding:5px;/* 内边界 */

}

#img11{

    float:left;

    margin:10px;/* 外边界 */

}

#txt11{

    color:green;

}

</style>

</head>

<body>

<!-- 图文混排 -->

<div id="hunpai">

<div id="img11" ><img src="data:images/1.png" width="200"></div>

<div id="txt11">我的博客是http:wwww.cnblogs.com/qingyundain 文字是一个汉语词汇，拼音为wén zì，基本意思是记录思想、交流思想或/承载语言的图像或符号。

出自《史记·秦始皇本纪》：“一法度衡石丈尺，车同轨，书同文字。”我的博客是http:wwww.cnblogs.com/qingyundain 我的博客是http:wwww.cnblogs.com/qingyundain 文字是一个汉语词汇，拼音为wén zì，基本意思是记录思想、交流思想或/承载语言的图像或符号。

出自《史记·秦始皇本纪》：“一法度衡石丈尺，车同轨，书同文字。”我的博客是http:wwww.cnblogs.com/qingyundain 我的博客是http:wwww.cnblogs.com/qingyundain 文字是一个汉语词汇，拼音为wén zì，基本意思是记录思想、交流思想或/承载语言的图像或符号。

出自《史记·秦始皇本纪》：“一法度衡石丈尺，车同轨，书同文字。”我的博客是http:wwww.cnblogs.com/qingyundain 我的博客是http:wwww.cnblogs.com/qingyundain 文字是一个汉语词汇，拼音为wén zì，基本意思是记录思想、交流思想或/承载语言的图像或符号。

出自《史记·秦始皇本纪》：“一法度衡石丈尺，车同轨，书同文字。</div>

<!-- 图文混排图片右浮动文字就在左 -->

</div>

</body>

</html>

效果：

javaWeb css图文混排的更多相关文章

  1. DIV+CSS 图文混排的图片居中办法

    不少人为了让 Div 图文混排的图片可以居中,给 IMG 套各式各样的 SPAN.DIV.LI 等等,以便于使用 text-align来进行居中. <div>图文混排 <br> ...

  2. css实现图文混排

    css实现图文混排 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

  3. 前端知识复习：Html DIV 图文混排（文字放在图片下边）

    Html知识复习之图文混排 练习练习基础 先上效果图: 废话不多说,直接贴代码: <!DOCTYPE html> <html xmlns="http://www.w3.or ...

  4. Android 图文混排 通过webview实现并实现点击图片

    在一个开源项目看到是用的webview 实现的 1. 这是在asset中的一个模板html <html> <head> <title>News Detail< ...

  5. 用NSAttributedString实现简单的图文混排

    iOS7以后,因为TextKit的强大,可以用NSAttributedString很方便的实现图文混排(主要是利用了NSTextAttachment). 关于Textkit的牛逼之处,可以参考objc ...

  6. 图文混排－－CoreText的简单运用

    常见的在一些微博微信中可以看见一段文字中有不同的字体,字体有不同的颜色,并且可能会有一些笑脸之类的表情,这些可以通过图文混排做到. 图文混排可以通过WebView和CoreText做到,其他还有别的方 ...

  7. 【转】关于FLASH中图文混排聊天框的小结

    原文链接 图文混排也是FLASH里一个很古老的话题了,我们不像美国佬那样游戏里面聊天框就是聊天框,全是文字干干净净,也不像日本人发明了并且频繁地使用颜文字.不管是做论坛.做游戏,必定要实现的一点就是带 ...

  8. ios图文混排

    图文混排的形式 1. 富文本形式 2. core Text(文字排版) 3. TextKit 4. UIWebView 一.富文本 我们可以采用attributeString来进行图文混排.例如一个文 ...

  9. Coretext实现图文混排及Gif图片播放

    CoreText是iOS3.2推出的一套文字排版和渲染框架,可以实现图文混排,富文本显示等效果. CoreText中的几个重要的概念:  CTFont CTFontCollection CTFontD ...

随机推荐

  1. linux开机挂载磁盘

    1. [root@localhost master-build]# cat /etc/fstab # # /etc/fstab # Created by anaconda on Thu Aug :: ...

  2. 性能测试工具LoadRunner30-LR之监控Tomcat

    步骤: 1.通过LR去访问tomcat监控页(安装tomcat的过程可以百度一下) 2.然后通过关联取监控数据 3.通过lr_user_data_point()添加数据到图表中去 double ato ...

  3. Windows 10 JDK安装及环境配置(vim+gcc)

    JDK安装 首先去官网下载JDK:点击进入 下载后点击安装: 中途会提示安装jre,注意jre的安装文件夹和jdk的不能相同,不然会覆盖掉jdk里面的jre文件.可以创建一个Java文件夹.将jdk和 ...

  4. nginx+keepalived主辅切换（监控脚本在keepalived.conf中执行）

    以前写过一篇,nginx+keepalived 双机互备的文章,写那篇文章的时候没有想过如果apache或者nginx 挂了,而 keepalived 或者 机器没有死,那么主辅是不会切换的,今天就研 ...

  5. Linux 启动盘命令

    linux下有很多工具可以制作启动盘, 例如 unetbootin 和 wubi, 不过我们可以使用linux下的一条命令来完成-----dd 操作方法: 1 卸载你的U盘 假设你的u盘对应的设备是s ...

  6. Entity Framework Many to Many Relation Mapping（Entity Framework多对多关系映射）

    通常我们在做数据库设计时都会有两张表是多对多关系的时候,在数据库做多对多关系时候我们通常通过中间关联表来处理,那我们现在在EF中是如何处理的呢? 假设我们有如下关系,用户(User)包含多个角色(Ro ...

  7. Redis整理第二波（启动、命令）

    启动 配置数据库数量: Redis默认开启16个数据库,不能像mysql自定义数据库名称,只能是数值,不能修改. 配置内存大小: 会生成一个和内存大小一样的文件. maxmemory 200mb #在 ...

  8. 执行引入外部 jar 包的类的方法

    liunx 系统中,命令行中语法:(.后面是冒号:) java -cp .:third.jar MyClass windows 系统中命令行的语法:(.后面是分号;) java -cp .;third ...

  9. Windows和Linux执行Java代码的不同方式

    一.Windows 下编译并执行 Java 字节码文件(类文件) 1.编译 Hello.java 源码文件: java -d . Hello.java 2.执行 Hello.class 字节码文件: ...

  10. Android Process & Thread

    Native Service and Android Service Native Service:In every main() method of NativeService, which is ...