【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. 091 Decode Ways 解码方法

    包含 A-Z 的字母的消息通过以下规则编码:'A' -> 1'B' -> 2...'Z' -> 26给定一个包含数字的编码消息,请确定解码方法的总数.例如,给定消息为 "1 ...

  2. yii2 加载静态资源

    1.在 assets/AppAsset 里定义方法 <?php /** * @link http://www.yiiframework.com/ * @copyright Copyright ( ...

  3. IT兄弟连 JavaWeb教程 Servlet定义以及环境配置 BS程序和CS程序

    随着网络技术的不断发展,单机的软件程序已难以满足网络计算机的需求.为此,各种各样的网络程序开发体系结构应运而生.其中,运用最多的网络应用程序开发体系结构可以分为两种,一种是基于客户端/服务器的C/S结 ...

  4. 状态模式和php实现

    状态模式: 允许一个对象在其内部状态改变时改变它的行为,对象看起来似乎修改了它的类.其别名为状态对象(Objects for States),状态模式是一种对象行为型模式. 模式分析: 在很多情况下, ...

  5. 【Web应用-迁移】迁移 Web 应用到新的应用服务计划的相关限制和说明

    现象描述 当前 Web 应用所在的应用服务计划和目标应用服务计划属于同一个资源组,但是通过 Portal 点击 “更改应用服务计划”,依旧看不到目标应用服务计划. 问题分析 导致上述问题的原因是,用户 ...

  6. mac重启privoxy命令

    重启命令 brew services restart privoxy

  7. 最常见的 5 个导致节点重新启动、驱逐或 CRS 意外重启的问题 (文档 ID 1524455.1)

    适用于: Oracle Database - Enterprise Edition - 版本 10.1.0.2 到 11.2.0.3 [发行版 10.1 到 11.2]本文档所含信息适用于所有平台 用 ...

  8. 在hibernate框架中配置显示sql语句

    使用Hibernate的框架开发时,可在Hibernate.cfg.xml中加上 <property name="hibernate.show_sql">true< ...

  9. python之道06

    1,使⽤循环打印以结果: * *** ***** ******* ********* 答案: 方法一: for i in range(10): if i % 2 == 1: print(i*'*') ...

  10. javascript querySelector和getElementById通过id获取元素的区别

    querySelector和getElementById通过id获取元素的区别 <!DOCTYPE html> <html> <head> <meta cha ...