我们经常会在报纸或杂志上看到首字下沉的效果，也就是第一段开头的第一个字非常醒目：
那在网页中我们如何实现这种效果呢？
.section {
font-size: 14px;
line-height: 1.6;
}
/* 这里用到了 first-letter 伪元素 */
.section::first-letter {
float: left;
margin-right: 5px;
line-height: 1;
font-size: calc(1em * 1.6 * 2); /* 下沉2行 */
color: #c33; /* 还可以修改首字颜色 */
}<p class="section">是谁击沉了那幻想的扁舟？是谁唤醒了梦中的弱者？是谁暗埋了恨的种子？是你赐它以永恒的沉默，是你以泪光驱散了迷茫，指引梦中的方向，“恨”的花蕾悄悄绽放，沉默的巨轮浮在花朵中央，它将载着你所有的沉默……</p>
Visitar URL original
我们经常会在报纸或杂志上看到首字下沉的效果，也就是第一段开头的第一个字非常醒目：
那在网页中我们如何实现这种效果呢？