【01】blockqote美化

 

<!DOCTYPE html>

<html lang="zh-cn">

<head>

    <meta charset="utf-8">

    <title>moyu's demo</title>

    <meta name="keywords" content="demo 测试 魔芋">

    <meta name="description" content="魔芋的测试示例">

    <meta name="robots" content="index,follow">

    <!-- 定义网页搜索引擎索引方式 -->

    <meta name="renderer" content="webkit">

    <!-- 360,以webkit内核进行渲染 -->

    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">

    <!-- 以最新内核进行渲染。 -->

    <meta http-equiv="Cache-Control" content="no-siteapp" />

    <!-- 百度禁止转码 -->

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>

    <style>

    blockquote {

        background: #f9f9f9;

        border-left: 10px solid #ccc;

        margin: 1.5em 10px;

        padding: .5em 10px;

        quotes: "\201C""\201D""\2018""\2019";

    }

    blockquote:before {

        color: #ccc;

        content: open-quote;

        font-size: 4em;

        line-height: .1em;

        margin-right: .25em;

        vertical-align: -.4em;

    }

    blockquote p {

        display: inline;

    }

    </style>

</head>

<body>

    <blockquote cite="http://www.worldwildlife.org/who/index.html">

        For 50 years, WWF has been protecting the future of nature. 

The world's leading conservation organization, WWF works in 100 countries and is supported by 1.2 million 

members in the United States and close to 5 million globally.

    </blockquote>

    <script></script>

</body>

</html>
效果：

 
 
 

【01】blockqote美化的更多相关文章

  1. 【全网最全的博客美化系列教程】01.添加Github项目链接

    全网最全的博客美化系列教程相关文章目录 [全网最全的博客美化系列教程]01.添加Github项目链接 [全网最全的博客美化系列教程]02.添加QQ交谈链接 [全网最全的博客美化系列教程]03.给博客添 ...

  2. 我为什么还要造轮子？欠踹？Monk.UI表单美化插件诞生记！

    背景 目前市场上有很多表单美化的UI,做的都挺不错,但是他们都有一个共同点,那就是90%以上都是前端工程师开发的,导致我们引入这些UI的时候,很难和程序绑定.所以作为程序员的我,下了一个决定!我要自己 ...

  3. 【博客美化】08.添加"扩大/缩小浏览区域大小" 按钮

    博客园美化相关文章目录: [博客美化]01.推荐和反对炫酷样式 [博客美化]02.公告栏显示个性化时间 [博客美化]03.分享按钮 [博客美化]04.自定义地址栏logo [博客美化]05.添加Git ...

  4. 【博客美化】06.添加QQ交谈链接

    博客园美化相关文章目录: [博客美化]01.推荐和反对炫酷样式 [博客美化]02.公告栏显示个性化时间 [博客美化]03.分享按钮 [博客美化]04.自定义地址栏logo [博客美化]05.添加Git ...

  5. 【博客美化】05.添加GitHub链接

    博客园美化相关文章目录: [博客美化]01.推荐和反对炫酷样式 [博客美化]02.公告栏显示个性化时间 [博客美化]03.分享按钮 [博客美化]04.自定义地址栏logo [博客美化]05.添加Git ...

  6. 【博客美化】04.自定义地址栏logo

    博客园美化相关文章目录: [博客美化]01.推荐和反对炫酷样式 [博客美化]02.公告栏显示个性化时间 [博客美化]03.分享按钮 [博客美化]04.自定义地址栏logo [博客美化]05.添加Git ...

  7. Arch Linux 安装、配置、美化和优化

    国庆假期玩了下Arch Linux,发现这货跟Ubuntu之流相差甚远,甚难调教,而且安裝过程全命令行,会有各种问题,各种知识... --- 安装引导器--- -------------------- ...

  8. ubuntu14.04美化

    首先我美化grub启动菜单背景和开关机背景,还有自动换壁纸.其它的美化日后再写博文. Grub启动菜单背景更换: 这个很简单,比以前的ubuntu和grub版本简单多了,直接将图片文件放到/boot/ ...

  9. CodeBlocks的汉化、主题美化及其调试功能的实现

    破事水 最近由于Cfree5经常崩溃+调试语句运行速度比较慢,想尝试一下另一个听说很好用的IDE Code::Blocks. 先上官网的安装包(自带mingw,安装完可以直接用,适用于windows系 ...

随机推荐

  1. javaoo面向对象

  2. C# 枚举类型的描述信息获取

    新建一个控制台方法,写好自己的枚举类型: 如图: 在里面添加获取描述的方法: 具体源码: 链接:http://pan.baidu.com/s/1nv4rGkp 密码:byz8

  3. I/O————字节流

    InputStream字节输入流 OutputStream字节输出流 用于以字节的形式读取和写入数据 下面是使用 字节输入流读取文件字节输出流写入文件 文件可能不存在,所以使用try catch pu ...

  4. CSS选择器手册

    CSS选择器手册 选择器       选择器名称         例子 例子描述 CSS E.class 类选择器 E.intro 选择 class="intro" 的所有E元素. ...

  5. plpgsql 数组、JSON相关

    Function Return Type Description Example Result array_append(anyarray,anyelement) anyarray append an ...

  6. Cuda入门笔记

    最近在学cuda ,找了好久入门的教程,感觉入门这个教程比较好,网上买的书基本都是在掌握基础后才能看懂,所以在这里记录一下.百度文库下载,所以不知道原作者是谁,向其致敬! 文章目录 1. CUDA是什 ...

  7. UIButton Making the hit area larger

    http://stackoverflow.com/questions/808503/uibutton-making-the-hit-area-larger-than-the-default-hit-a ...

  8. python基础一 day14 复习

    迭代器和生成器迭代器:双下方法 : 很少直接调用的方法.一般情况下,是通过其他语法触发的可迭代的 —— 可迭代协议 含有__iter__的方法('__iter__' in dir(数据))可迭代的一定 ...

  9. 用border实现三角形的过程

    div{ width:100px; height:100px; background:yellow; border-top: 20px solid red; border-right:20px sol ...

  10. 第1节 flume：13、14、更多flume案例一，通过拦截器实现不同类型的数据区分

    1.6.flume案例一 1. 案例场景 A.B两台日志服务机器实时生产日志主要类型为access.log.nginx.log.web.log 现在要求: 把A.B 机器中的access.log.ng ...