在網頁設計的過程中，我們需要讓某些特定的內容呈現出特別的效果，比如突出顯示某個商品的價格優惠。這時，我們可以利用 CSS 技術來添加打折角標來強調這個優惠信息。

.discount {
position: relative;
display: inline-block;
margin: 10px;
padding: 5px;
font-size: 18px;
font-weight: bold;
color: #333;
text-align: center;
}
.discount::before {
position: absolute;
content: '';
top: 0;
right: 0;
width: 0;
height: 0;
border-top: 30px solid #f00;
border-right: 30px solid transparent;
}
.discount::after {
position: absolute;
content: '折';
top: 10px;
right: 5px;
padding: 0 5px;
background-color: #f00;
color: #fff;
}

在上面的代碼中，我們首先定義了一個名為 discount 的 class，用來表示需要添加打折角標的內容。我們使用相對定位來讓打折角標的絕對定位基于該元素，從而在該元素的底部右上角添加一個紅色的三角形。

注意到 before 和 after 的語法，它們使用了雙冒號（::）標記偽元素。在 before 中，我們設定了它的右側為透明的，這樣可以產生一個三角形的特殊效果。而在 after 中，我們通過 content 屬性來顯示“折”字，同時設定了元素的背景顏色為紅色，顏色為白色。

最后，我們只需要在需要添加打折角標的內容中添加 discount 類即可：

<p>這件商品原價為 $100，現在僅需 <span class="discount">$70</span> 即可購買。</p>

通過以上 CSS 代碼，我們成功地將 $70 的文字加上了打折角標，并將其突出顯示。這樣，我們就可以通過 CSS 來讓某些內容在頁面中更加醒目突出。