在 HTML 中，CSS 用來控制網頁的樣式和布局，它能夠讓我們更加靈活地為網頁添加各種各樣的效果。使用 CSS 的方式很簡單，只需要在 HTML 文件中引用 CSS 文件即可。在引用 CSS 文件的時候，我們可以使用擴展文件名來為不同類型的文件指定不同的樣式。

<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/less" href="style.less">
<link rel="stylesheet" type="text/scss" href="style.scss">

上面的代碼就是三種不同的擴展文件名：.css、.less、.scss。它們分別代表 CSS、Less 和 SCSS 文件，它們的區別在于語法和功能不同。使用這些擴展文件名可以讓我們更加靈活地使用 CSS，提高開發效率。

例如，使用 Less 或 SCSS 可以增加 CSS 文件的可維護性。它們提供了一些代碼復用的機制，比如變量、嵌套、混合等，能夠幫助我們減少代碼量，同時也讓代碼更加清晰易懂。

/* Less 變量 */
@primary-color: #007bff;
/* SCSS 變量 */
$primary-color: #007bff;
/* Less 嵌套 */
.navbar {
ul {
li {
a {
color: @primary-color;
}
}
}
}
/* SCSS 嵌套 */
.navbar {
ul {
li {
a {
color: $primary-color;
}
}
}
}

總而言之，使用不同的擴展文件名可以讓我們更加靈活地使用 CSS，提高開發效率和代碼可維護性。