Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/apache-spark/6.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
第一个字母伪元素与CSS中的引号符号不正常工作_Css_Pseudo Element_Blockquote - Fatal编程技术网

第一个字母伪元素与CSS中的引号符号不正常工作

第一个字母伪元素与CSS中的引号符号不正常工作,css,pseudo-element,blockquote,Css,Pseudo Element,Blockquote,我正在尝试设计一个pull quotediv标记。我想设置引号“的样式,使其比语句的其余部分更大 我曾想过使用第一个字母伪元素。但是,当我这样做时,它没有正常工作。下面是我尝试过的案例: 如果我这样写句子:“这是一个测试”,(在“和T之间没有空格),那么“T看起来都很大 如果我在它们之间留一个空格,它们都不会变大 我的问题是:有没有办法让“变得更大 下面是我使用的html代码:“这是一个测试 css: .pullquote-right { display: inline-block; max-w

我正在尝试设计一个
pull quote
div标记。我想设置引号
的样式,使其比语句的其余部分更大

我曾想过使用
第一个字母
伪元素。但是,当我这样做时,它没有正常工作。下面是我尝试过的案例:

如果我这样写句子:
“这是一个测试”
,(在
T
之间没有空格),那么
“T
看起来都很大

如果我在它们之间留一个空格,它们都不会变大

我的问题是:有没有办法让
变得更大

下面是我使用的html代码:
“这是一个测试

css:

.pullquote-right {
display: inline-block;
max-width: 350px;
float: right;
padding-left: 15px;
margin-left: 25px;
border-left: #3b5998;
border-left-width: thick;
border-left-style: solid;   
font-style: italic;
color: darkgray;
font-size:115%;}

.pullquote-right::first-letter {font-size: 200%;}

谢谢。

第一个字母伪类指的是第一个字母及其前面的标点符号。参考:

我认为做你想做的最简单的方法可能是在你想做得更大的标点周围放置一个span标记,并根据css设置样式


或者您也可以查看此解决方案:

一个选项是使用::before和::after伪元素

.quote::之前,
.引用::之后{
内容:“\0022”;
字号:2em;
字体大小:粗体;
颜色:绿色;
垂直对齐:-.3em;
}

这是一个很好的引用

我最终将这两个答案结合起来,以便能够使用
div
标记,而不必添加extre

,如下所示:

.pullquote左键{
显示:内联块;
最大宽度:350px;
浮动:左;
填充:20px;
左边距:15px;
左边框:#3b5998;
边框左宽度:粗;
左边框样式:实心;
字体:斜体;
颜色:暗灰色;
字体大小:110%;
背景色:白色;
盒影:5px 5px 5px#8888888;
文本对齐:居中;
}
.pullquote左::前{
字号:2em;
字体大小:粗体;
内容:“\201C”;
}

这是最终结果。
非常感谢Rose提供的参考和示例。感谢haltersweb。这个答案也很有帮助。感谢BoltClock的编辑。它确实帮助我了解了更多关于选择标签的信息。请检查这一点,这将有助于提高您的内容质量