※このサンプルは、Google ChromeとSafariの最新版でご覧ください。FirefoxとIEは、動作はしますが最適化されていません。
#menu ul.level1 { background: #5be; background-image: -webkit-gradient(linear, 0% 0%, 0% 95%, from(rgba(255, 255, 255, 0.7)), to(rgba(255, 255, 255, 0))); background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0)); -o-box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5); -icab-box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5); -khtml-box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5); -moz-box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5); box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5); -o-border-radius: 8px; -icab-border-radius: 8px; -khtml-border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; }
Source: cssplay.co.uk