标签: blockquote

在 HTML5 中，把blockquotes段落放在里面是正确的还是相反的正确方式？我的意思是，逻辑告诉我们 ablockquote可能引用了多个段落，不是吗？

但是blockquotes不需要包含q元素吗？有人可以向我解释正确的结构吗？

编辑：添加一些信息。我有这个疑问，因为在尝试使用 CSS 实现引号时，它们不会出现blockquote在q元素上，但会出现在元素上。这样做的正确方法是什么？

blockquote, q {
  quotes: "\201C""\201D""\2018""\2019";
  font-style: italic;
}

<blockquote>
  <p>Hello!</p>
  <p>Say something!</p>
</blockquote>
<p>He told me <q>Say something!</q>
</p>

如何用这些巨大的引号来设定引号？

我尝试过在线显示的大部分示例.使用带有:before和:after css样式的块引用.由于响应性的原因,我遇到的问题是避免在div中使用图像.我也在使用Twitter Bootstrap框架.

html中的引用:

<div class="container">
    <blockquote><h3>Whenever you see a successful business, someone once made a courageous decision. ~Peter F. Drucker</h3></blockquote>
</div>

和css:

blockquote {
border:none;
font-family:Georgia, "Times New Roman", Times, serif;
margin-bottom:-30px;
}

blockquote h3 {
    font-size:21px;
}

blockquote h3:before { 
    content: open-quote;
    font-weight: bold;
    font-size:100px;
    color:#889c0b;
} 
blockquote h3:after { 
    content: close-quote;
    font-weight: bold;
    font-size:100px;
    color:#889c0b;
}

问题就是看起来像这个例子.虽然响应性确实有点工作.引号不是彼此对角放置的

如何设计块引用的样式，使其侧面有一个竖线？我正在寻找类似 Stack Exchange 的块引用之类的东西。截屏：

这是我到目前为止所尝试过的：

blockquote {
    position: relative;
    margin: 1em;
    padding: 0.5em 1.5em;
    color: gray;
}

blockquote:before {
    display: block;
    position: absolute;
    content: " ";
    bottom: 5px;
    top: 5px;
    left: 0;
    border-left: 4px solid gray;
}

这似乎可行，但我不太确定，因为我对 CSS 不太熟悉。我的解决方案中是否存在错误？如何改进？

是否可以更改<blockquote>在 Android 中呈现的内容样式TextView？

我正在像这样设置文本：

textView.setText(Html.fromHtml(someHtmlString));

在android:Theme.Light主题中，这会像普通文本一样呈现块引用，但在段落的左侧边缘有一条细的蓝色垂直线。

研究

我已经检查了 的 XML 属性TextView，但找不到任何提及 blockquote 样式的内容。我还检查了我正在使用的主题的源代码，但找不到任何可能听起来的属性。

想要的风格

理想情况下，我想控制文本的缩进量，并应用一些简单的样式，例如斜体到<blockquote>.

可以通过在将文本传递给 之前在所有标签中插入标签来使文本成为斜体，但这并不理想。<i><blockquote>Html.fromHtml()

我正在尝试使用ReactJS和JSX为样式指南创建概念证明.

我希望能够显示如何调用组件执行此操作的原始html.JSX忽略了我的<code>标签并渲染了组件

这是我到目前为止尝试 用HTML格式显示HTML代码

<blockquote>
  <pre>
    <code>
      <VideoPlayer 
        ref="videoplayer" 
        preload={this.props.preload} 
        classes={this.props.classes} 
        videoID={this.props.videoID}
        controls="controls" 
      />     
    </code>
  </pre>
</blockquote>

我很惊讶地看到它渲染.

我有一个<blockquote>我想用双顶边框设计的样子,如下图所示:

棘手的部分是我想坚持使用一个元素,即<blockquote>元素,因为HTML将由WYSIWYG生成.

这是我到目前为止所得到的:

blockquote
  background: #fafcfc
  border-top: 1px solid #dfe7e9
  border-bottom: 1px solid #dfe7e9
  font-size: 19px
  font-style: italic
  font-weight: 300
  padding: 45px 40px
  margin: 35px 0

请记住,我可能需要:before和:after双引号字符串.

我正在尝试为我正在处理的网站上的块引用定义全局样式.

目标是设置块引号的样式,使它们看起来与下图相似.我想避免修改DOM结构.

使用伪类我想在元素的上方和下方显示水平平行边框,但这些线应该只是元素本身的一半宽并且水平居中.

这是迄今为止我已经得到的,但线条没有正确居中.

blockquote {
    margin: 0 auto;
    position: relative;
    text-align: center;
    display: table;
    font-size: 15px;
}

blockquote:before {
    content: '\A';
    height: 1px;
    width: 40%;
    position: absolute;
    background: #000;
    top: -8px;
}

blockquote:after {
    content: '\A';
    height: 1px;
    width: 40%;
    position: absolute;
    background: #000;
    bottom: -8px;
}

<blockquote>
  Neque porro quisquam e porro quisquest qui dolorem ipsum quia dolor sit<br />
 est qui dolorem ipsum quia dolor sit amet rem ipsum quia 
</blockquote>

.normal-text我需要在使用该类的元素之前显示引导字形：我正在尝试以下操作，但它显示的是代码而不是图标。

.normal-text{
   border-left-width: 1px !important;
   font-size: 110% !important;
   color: #100cce;
   font-family: 'Book Antiqua';
}
.normal-text::after{
   content: '<span class="glyphicon glyphicon-pencil"></span>'
}
    

<blockquote class="normal-text"> Some Text </blockquote>

请提供这方面的帮助。

如何使块引用行的高度与元素内的文本完全相同。

下面是它应该是什么样子的示例：

这是我从创建的代码中得到的当前结果：

blockquote {
  margin: 20px 0 30px;
  padding-left: 20px;
  border-left: 5px solid #1371b8;
}

<blockquote>Test</blockquote>

从结果中，我们可以看到该行在垂直方向上比文本大。