七步詩是一種常見的古代詩歌形式，由七句組成。在前端開發中，我們常常使用 CSS 樣式來美化網頁，而七步詩的樣式可以作為一個好的教學案例展示 CSS 的技巧。下面是七步詩樣式的 CSS 代碼：

.poem {
font-family: '宋體', sans-serif;
font-size: 18px;
line-height: 1.5;
margin: 0;
padding: 0;
}
.poem p {
margin: 0;
padding: 0;
}
.poem p:first-child {
text-align: center;
font-size: 24px;
font-weight: bold;
}
.poem p:nth-child(2) {
text-align: right;
margin-right: 50px;
font-style: italic;
}
.poem p:nth-child(3) {
text-indent: 2em;
margin-right: 50px;
letter-spacing: 1px;
}
.poem p:nth-child(4),
.poem p:nth-child(5),
.poem p:nth-child(6) {
text-indent: 2em;
margin-left: 50px;
}
.poem p:last-child {
text-indent: 2em;
text-align: center;
}

首先，我們為整個文本區域設置了一個樣式類名為 .poem，將字體樣式、字號、行間距、外邊距和內邊距設置為默認值。接下來，我們對每個<p>元素應用不同的樣式：

• 第一個<p>要求居中顯示，字號要大于其他段落，加粗
• 第二個<p>要求右對齊并斜體
• 第三個<p>要求首行縮進，右側留空，并增加字母間距
• 第四、五、六個<p>要求首行縮進，左側留空
• 最后一個<p>要求首行縮進，居中顯示

通過這種方式，我們可以看到 CSS 的語法在處理不同的元素時是多么靈活。七步詩的樣式對于我們學習 CSS 屬性、選擇器和實現網頁美化效果有一定的幫助。