第一个字母的CSS实现,第一个词放大效应

第一个字母的CSS实现,第一个词放大效应
本文主要介绍了css实现的第一个字母段,第一个字放大效果,效果很好,需要的朋友可以参考下。

摘要:

段落的第一个字母扩展是指段落开头的字母或汉字,主要是使用CSS的第一个字母类选择器。
单线放大:

在第一行,效果如下:
复制代码代码如下所示:

文件

{体
背景颜色:# ffffff;
颜色:# 595959;
}
{。包含
宽度:150px;
}
包含p {
字体:80% / 1.6 Verdana,日内瓦,Arial,Helvetica,sans-serif;
}
包含p:第一个字母
字体大小:2em;
填料:0.1em;
颜色:# 000000;
垂直对齐:中间;
}
包含p:第一线
颜色:红色;
}
包含:第一个孩子:第一个字母
颜色:红色;
}
包含{第一个孩子:第一线
颜色:继承;
}

这是一篇测试文章。这是一篇测试文章。
这是一篇测试文章。这是一篇测试文章。
这是测试。

注:第一个字母+支持IE7,IE8 +一线支持
行扩大:

结果如下:

复制代码代码如下所示:

文件
{ *
保证金:0;
填充:0;
}
{体
字体大小:12px;
字体:宋体,日内瓦,无衬线字体;
填料:200px;
}
{ p
宽度:150px;
颜色:# 000;
字体大小:1em;
边距:20px;
}
p:第一个字母{
浮点数:左;
字体大小:2.5em;
填充右:5px;
文本转换:大写;
}
p:第一线{
颜色:# F00;
}

这是一篇测试文章。这是一篇测试文章。
这是一个测试。这是一个测试。这是一个测试。这是一个测试。这是一个测试。这是一个测试。这是一个测试。

tag:效应第一个字母电脑软件CSS

相关内容