<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>

    <title>无标题文档</title>

    <link rel="shortcut icon" href="img/icoTest.ico">

</head>

<style type="text/css">

    .content{

        width: 200px;

        height: 300px;

        border: 1px solid #ccc;

    }

    .content img{

        float: left;

        width: 100px;

        height: 100px;

    }

    .content p{

        text-indent: 32px;

    }

</style>

<body>

    <div class="content">

        <img src="heart.png">

        <p>这是段落中的一些文本。 这是段落中的一些文本。 这是段落中的一些文本。 这是段落中的一些文本。 这是段落中的一些文本。 这是段落中的一些文本。 这是段落中的一些文本。 这是段落中的一些文本。 这是段落中的一些文本。 这是段落中的一些文本。 这是段落中的一些文本。 这是段落中的一些文本。</p>

    </div>

</body>

<html>

HTML+CSS图文排版的更多相关文章

  1. CSS页面排版的一点笔记

    CSS页面排版 字体族 字体族的值是一个字体备选列表,多个字体使用英文逗号隔开,字体名称如果有空格则需要引号. font-family: "Georgia Pro", " ...

  2. ACM TOMM 2017最佳论文：让AI接手繁杂专业的图文排版设计工作

    编者按:你是否曾经为如何创作和编辑一篇图文并茂.排版精美的文章而烦恼?或是为缺乏艺术灵感和设计思路而痛苦?AI技术能否在艺术设计中帮助到我们?今天我们为大家介绍的这篇论文,“Automatic Gen ...

  3. html学习第二天—— 第九、十章——CSS的继承、层叠和特殊性+CSS格式化排版

    继承CSS的某些样式是具有继承性的,那么什么是继承呢?继承是一种规则,它允许样式不仅应用于某个特定html标签元素,而且应用于其后代.比如下面代码:如某种颜色应用于p标签,这个颜色设置不仅应用p标签, ...

  4. CSS文字排版

    一.font-size 我来试一试:为第一段中的“胆小如鼠”设置字号为:20px,字体颜色为:red. <!DOCTYPE HTML> <html> <head> ...

  5. HTML+CSS学习笔记 (10) - CSS格式化排版

    文字排版--字体 我们可以使用css样式为网页中的文字设置字体.字号.颜色等样式属性.下面我们来看一个例子,下面代码实现:为网页中的文字设置字体为宋体. body{font-family:" ...

  6. BootStrap入门教程 (二) ：BASE CSS（排版(Typography),表格(Table),表单(Forms),按钮(Buttons)）

    上讲回顾:Bootstrap的手脚架(Scaffolding)提供了固定(fixed)和流式(fluid)两种布局,它同时建立了一个宽达940px和12列的格网系统. 基于手脚架(Scaffoldin ...

  7. CSS格式化排版--排版

    1.文字排版--字体:利用font-family设置字体,注意设置的字体必须是本地电脑中存在的字体. 例子:class="MicrosoftYahei"的h1标签的字体设置为 宋体 ...

  8. 从零开始学习html（十）CSS格式化排版——下

    六.文字排版--删除线 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type&q ...

  9. 从零开始学习html（十）CSS格式化排版——上

    一.文字排版--字体 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type&qu ...

随机推荐

  1. Java进程配置文件Reload

    我们在开发Java程序的时候,很多常量信息都存在配置文件中,比如数据库连接信息.ip黑名单,事件的超时时间等等.当需要该这些配置的值时都需要重新启动进程,改动的配置才会生效,有时候线上的应用不能容忍这 ...

  2. Linux内核设计第三周学习总结 跟踪分析Linux内核的启动过程

    陈巧然 原创作品 转载请注明出处 <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 实验步骤 登陆实验楼虚 ...

  3. 代码收藏系列--javascript--日期函数

    /** * 获取当前时间的简短函数 * @returns {String} * @@example getTimeStamp() 结果是:2017-07-12 09:21:30 */ function ...

  4. [ACM]Codeforces Round #534 (Div. 2)

    A. Splitting into digits Vasya has his favourite number n. He wants to split it to some non-zero dig ...

  5. python基础----递归函数（二分法、最大深度递归）

    递归函数 定义:在函数内部,可以调用其他函数.如果一个函数在内部调用自身本身,这个函数就是递归函数. #例子1 # age()=age()+ n= age(n)=age(n-)+ # age()=ag ...

  6. springMVC参数的获取区别

    在springMVC中我们一般使用注解的形式来完成web项目,但是如果不明白springmvc的对于不同注解的应用场景就会很容易犯错误 1.什么是restful形式: 什么是RESTful restf ...

  7. RabbitMQ的基础介绍

    转自:http://blog.csdn.net/whycold/article/details/41119807 一.引言 你是否遇到过两个(多个)系统间需要通过定时任务来同步某些数据?你是否在为异构 ...

  8. 深度学习voc数据集图片resize

    本人新写的3个pyhton脚本. (1)单张图片的resize: # coding = utf-8 import Image def convert(width,height): im = Image ...

  9. 分块 （貌似能用LCT做，反正我现在还不会） BZOJ 2002

    2002: [Hnoi2010]Bounce 弹飞绵羊 Time Limit: 10 Sec  Memory Limit: 259 MBSubmit: 9844  Solved: 5070[Submi ...

  10. 重构改善既有代码设计--重构手法10：Move Method （搬移函数）

    你的程序中,有个函数与其所驻类之外的另一个类进行更多的交流:调用后者,或被后者调用.在该函数最常用引用的类中建立一个有着类似行为的新函数.将旧函数编程一个单纯的委托函数,或是将旧函数完全移除. 动机: ...