<!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. python实现RSA加解密

    # coding=utf-8 """ @author:Eleven created on:2018年10月30日 """ import bi ...

  2. Zookeeper(四)Hadoop HA高可用集群搭建

    一.高可就集群搭建 1.集群规划 2.集群服务器准备 (1) 修改主机名(2) 修改 IP 地址(3) 添加主机名和 IP 映射(4) 同步服务器时间(5) 关闭防火墙(6) 配置免密登录(7) 安装 ...

  3. PHP 多线程采集

    function curl_multi($urls) { if (!is_array($urls) or count($urls) == 0) { return false; } $num=count ...

  4. codeforces gym101243 A C D E F G H J

    gym101243 A #include<iostream> #include<cstdio> #include<cmath> #include<cstrin ...

  5. 手脱FSG 2.0 -> bart/xt

    声明: 只为纪录自己的脱壳历程,高手勿喷 1.在入口的第二行ESP定律下硬件断点然后F9运行8次(因为第9次就跑飞了) 0040955C > pushad 0040955D EB jmp //E ...

  6. [DeeplearningAI笔记]序列模型2.3-2.5余弦相似度/嵌入矩阵/学习词嵌入

    5.2自然语言处理 觉得有用的话,欢迎一起讨论相互学习~Follow Me 2.3词嵌入的特性 properties of word embedding Mikolov T, Yih W T, Zwe ...

  7. JAVA类与对象---实例变量与类变量的区别,实例方法和类方法的区别

    实例变量 实例变量声明在一个类中,但在方法.构造方法和语句块之外: 当一个对象被实例化之后,每个实例变量的值就跟着确定: 实例变量在对象创建的时候创建,在对象被销毁的时候销毁: 实例变量的值应该至少被 ...

  8. 2017北京国庆刷题Day7 morning

    期望得分:100+0+100=200 实际得分:100+20+0=120 离散化搞搞 #include<cstdio> #include<iostream> #include& ...

  9. 2017 济南精英班 Day1

    不管怎么掰都是n*m-1 #include<cstdio> using namespace std; int main() { freopen("bpmp.in",&q ...

  10. java多线程机制2(安全问题)

    线程状态图: ================================================================================= /* * 线程安全问题 ...