MDUI是一種基于Material Design的UI框架，它采用了許多CSS3技術來實現這種現代化、平滑的外觀。本文將介紹MDUI中使用的一些重要的CSS3技術。 首先是transition，這是實現動畫效果的常見方法。MDUI使用過渡來使按鈕、圖標和其他元素在鼠標懸停或單擊時變得更加生動。下面是一個使用CSS3 transition的示例:

.mdui-btn {
transition: background-color 0.3s ease-out;
}
.mdui-btn:hover {
background-color: #2196F3;
}

上面的代碼將使按鈕在鼠標懸停時以0.3秒的時間逐漸變成藍色。 其次是box-shadow，這是添加立體效果的一種方法。MDUI使用這個屬性來給卡片、面板和其他元素添加投影。下面是一個例子:

.mdui-card {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2), 0 1px 1px rgba(0, 0, 0, 0.14), 0 2px 1px rgba(0, 0, 0, 0.12);
}

此代碼將為MDUI卡片元素添加一個標準的Material Design投影: . 最后是border-radius，這是將元素的角變成圓形或橢圓形的方法。MDUI使用該屬性來使元素的角變得更加圓滑，從而使設計更舒適。下面是一個例子:

.mdui-textfield {
border-radius: 4px;
}

此代碼將使輸入框的角變得更加圓滑。 總之，MDUI使用許多CSS3技術來實現它的現代化、平滑的外觀。這些技術包括transition、box-shadow和border-radius，它們讓MDUI在Web設計中成為一個令人印象深刻的框架。