利用css完成如图的排版

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>

<style>
p{
font-size:16px;
padding-right:10px;
padding-top:8px;
line-hright:120%;
}
span{
font-size:40px;
float:left;
padding-right:5px;
padding-left:10px;
padding-top:8px;
}
div{
font-size:30px;
color:#FFF;
background:#999;

}
</style>
</head>
<body>
<div align="center" >Head Line</div>
<img src="data:imagess/cup.gif" style="float:left;" />
<span>T</span>
<p>he Internet Society’s mission is to achieve a world in which everyone everywhere is connected to an open and universally accessible Internet. Since its inception in 1992, ISOC has been at the forefront of global Internet education by bringing essential information and training to people throughout the world.The Internet Society’s mission is to achieve a world in which everyone everywhere is connected to an open and universally accessible Internet. Since its inception in 1992, ISOC has been at the forefront of global Internet education by bringing essential information and training to people throughout the world.</p>
</body>
</html>

web新内容的更多相关文章

  1. 基于Metronic的Bootstrap开发框架经验总结（9）--实现Web页面内容的打印预览和保存操作

    在前面介绍了很多篇相关的<Bootstrap开发框架>的系列文章,这些内容基本上覆盖到了我这个Bootstrap框架的各个主要方面的内容,总体来说基本达到了一个稳定的状态,随着时间的推移可 ...

  2. web页面内容优化管理与性能技巧

    来源:GBin1.com 回 想一下,以前我们不得不花费大量时间去优化页面内容(图片.CSS等等),如今用户有更快速的互联网链接,我们似乎能够使用更大的图像或更大的闪 存文件,里面包含的有视频或者图片 ...

  3. （转）基于Metronic的Bootstrap开发框架经验总结（9）--实现Web页面内容的打印预览和保存操作

    http://www.cnblogs.com/wuhuacong/p/5147368.html 在前面介绍了很多篇相关的<Bootstrap开发框架>的系列文章,这些内容基本上覆盖到了我这 ...

  4. Windows cmd 长时间不输出新内容 直到按下ctrl + c 取消或者回车的解决办法

    换了一台新电脑, 在使用 ant 拷贝大量文件的时候 cmd 窗口过了很久没有继续输出新的内容,远远超过平时的耗时, 以为已经卡死 按下 ctrl + c 取消, 这时并没有取消, 而是输出了新内容, ...

  5. 新内容转入github

    所有新内容已经转入 https://github.com/honggzb/Study-General https://github.com/honggzb/Study2016

  6. jQuery 往table添加新内容有以下四个方法：

    Query 添加新内容有以下四个方法: append() - 在被选元素的结尾插入内容 prepend() - 在被选元素的开头插入内容 after() - 在被选元素之后插入内容 before() ...

  7. 从kepware定时取web api内容

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  8. xcode10设置自定义代码快 - Xcode10新功能新内容

    1. 2. 详情: Xcode10新功能新内容https://blog.csdn.net/u010960265/article/details/80630118

  9. 添加新内容的四个 jQuery 方法：append，prepend，after，before

    添加新内容的四个 jQuery 方法区别如下: append() - 在被选元素(里面)的结尾插入内容prepend() - 在被选元素(里面)的开头插入内容 //jQuery append() 方法 ...

随机推荐

  1. POJ 3294 二分找超过一半字符串中存在的子串

    题目大意: 给定n个字符串,求出现在不小于k/2个字符串中的最长子串. 二分找对应子串长度的答案,将所有字符串链接成一个长字符串求后缀数组,记录每一个位置本属于第几个字符串,利用height查询的时候 ...

  2. iOS -- 处理推送消息

    简介 很多应用都会实现推送功能,我们可以集成第三方框架实现推送功能,比如: JPush推送:https://www.jpush.cn 个推:http://www.getui.com 下面来说说收到推送 ...

  3. linux命令每日一练习 显示一个文件的制定行－－－查看命令帮助信息

    sed -n '11,12p' ××× cat ***|tail -n +12|head -n 2 tail -n +5 显示末尾五行 查看一个命令的帮助 详细的 man *** 简略的 *** -- ...

  4. 算法导论----贪心算法，删除k个数，使剩下的数字最小

    先贴问题: 1个n位正整数a,删去其中的k位,得到一个新的正整数b,设计一个贪心算法,对给定的a和k得到最小的b: 一.我的想法:先看例子:a=5476579228:去掉4位,则位数n=10,k=4, ...

  5. Windows 8.1 with Update MSDN 简体/英文/繁体

    PS:请不要使用离线下载,以免镜像损坏! 1.CN: 文件名:cn_windows_8.1_enterprise_with_update_x64_dvd_4048578.isoSHA1:2D9BFE9 ...

  6. Android Bitmap Drawable 常用摘要

    1.缩放 public Bitmap scalingBitmap(Bitmap bitmap, int newW, int newH) { int w = bitmap.getWidth(); int ...

  7. marquee 实现首尾相连循环滚动效果

    <marquee></marquee>可以实现多种滚动效果,无需js控制.使用marquee标签不仅可以滚动文字,也可以滚动图片,表格等  marquee标签不是HTML3.2 ...

  8. Hello, RealSense!

    这是kinect for windows: 这是华硕 xtion pro: 这是Intel® RealSense™: 几经周折,终于买到了,99美元套件+25美元运费,正在旅途中.

  9. php递归读取目录

    function recursion_dir($dir){ $files = array(); if($handle = opendir($dir)){ while(($file = readdir( ...

  10. Math.abs(~2018)，掌握规律即可！

    Math.abs(~2018) 某前端群的入门问题长姿势了,一个简单的入门问题却引发了我的思考,深深的体会到自己在学习前端技术的同时忽略遗忘了一些计算机的基础知识. 对于 JS Math对象没什么可说 ...