zoukankan      html  css  js  c++  java
  • HTML 5 <blockquote><p>的分工与合作

    一提到文档标签,大家首先想到的就是p,那如果要实现缩进及间距,还得使用margin,padding及text-indent等css样式。

    但现在html5的一个新标签解决了以上所有问题,它可以自缩进和自间距,这就是blockquote标签一个人的功劳。

    <blockquote> 标签定义摘自另一个源的块引用。

    <blockquote> 与 </blockquote> 之间的所有文本都会从常规文本中分离出来,经常会在左、右两边进行缩进(增加外边距),而且有时会使用斜体。也就是说,块引用拥有它们自己的空间。

    实例

    毛主席说过:
    <blockquote>帝国主义都是纸老虎 ... </blockquote>
    

    亲自试一试

    如果标记是不需要段落分隔的短引用,请使用 <q> 元素。blockquote 只应该应用于来自另一个源的引用。

    <q>标签标记短的引用,浏览器经常在引用的内容周围添加引号。

    实例

    <q>Here is a short quotation here is a short quotation</q>
    

    亲自试一试

    -----------------------------------------------------------

    如需把页面作为 strict XHTML 进行验证,那么 <blockquote> 元素必须包含块级元素,比如这样:

    <blockquote>
    <p>here is a long quotation here is a long quotation</p>
    </blockquote>

    ----------------------------------------------------------------------------------------

    那问题来了,CSS中如何让blockquote里的段落<p>不缩进呢?

    P已经全局定义为缩进两个字符。当段落中需要加Blockquote时,这行文字是<blockquote><P>... ... ...<P> </blockquote>,文字同样缩进了两个字符。有什么方法实现呢?

     

    最佳答案
     
    blockquote{ margin:0; }/*去掉blockquote本身带的缩进。*/
    blockquote p{text-indent:0;}

    <q> 与 <blockquote> 的区别

    <q> 标签在本质上与 <blockquote> 是一样的。不同之处在于它们的显示和应用。<q> 标签用于简短的行内引用。如果需要从周围内容分离出来比较长的部分(通常显示为缩进的块),请使用 <blockquote> 标签。

  • 相关阅读:
    win10 uwp 弹起键盘不隐藏界面元素
    win10 uwp 存放网络图片到本地
    win10 uwp 存放网络图片到本地
    sublime Text 正则替换
    sublime Text 正则替换
    win10 uwp 绘图 Line 控件使用
    win10 uwp 绘图 Line 控件使用
    AJAX 是什么?
    什么是 PHP SimpleXML?
    PHP XML DOM:DOM 是什么?
  • 原文地址:https://www.cnblogs.com/ibingbing/p/5846865.html
Copyright © 2011-2022 走看看