雖然在日常開發(fā)中我們經(jīng)常使用的是一些基礎(chǔ)的CSS樣式，但是在一些特定的場(chǎng)景下也會(huì)用到一些不常用的CSS模式。今天我們就來(lái)探討一下一些不常用但很實(shí)用的CSS模式。

1. :target 偽類

<style>
:target {
color: red;
}
</style>
<h2 id="target-heading">This is the target heading</h2>
<a href="#target-heading">Click here to target the heading</a>

這個(gè)偽類可以給特定的元素添加樣式，并且僅在元素成為文檔當(dāng)前活動(dòng)目標(biāo)時(shí)才可見(jiàn)

2. transform-origin 屬性

<style>
.box {
background-color: blue;
transform: rotate(45deg);
transform-origin: 50% 50%;
}
</style>
<div class="box"></div>

這個(gè)屬性可以指定元素變換的原點(diǎn)，通常默認(rèn)為元素的中心點(diǎn)，但是我們也可以根據(jù)需求來(lái)指定。

3. @font-face 規(guī)則

<style>
@font-face {
font-family: myFont;
src: url('myFont.ttf');
}
.custom-font {
font-family: myFont, sans-serif;
}
</style>
<p class="custom-font">Custom font text</p>

這個(gè)規(guī)則可以讓我們?cè)诰W(wǎng)站中使用自己的字體，我們可以通過(guò)引入字體文件并使用 @font-face 規(guī)則來(lái)加載自定義字體。

總之，學(xué)習(xí)并掌握這些不常用但實(shí)用的CSS模式可以讓我們?cè)陂_發(fā)過(guò)程中更加靈活，也可以提高我們的開發(fā)效率。