Đề bài: [Thiết kế Web] Menu điều hướng nhiều cấp

Cho HTML sau là menu điều hướng .menu gồm ul > li cấp 1 (Trang chủ, Sản phẩm, Liên hệ), riêng "Sản phẩm" chứa thêm một ul.submenu với 2 liên kết con (Hàng mới, Khuyến mãi có href="#sale").

Viết CSS đạt ĐỒNG THỜI 4 yêu cầu, chọn đúng loại bộ chọn cho từng yêu cầu:

1. .menu > ul > li: display:inline-block, margin-right:20px — chỉ áp dụng cho 3 mục cấp 1, KHÔNG áp dụng cho li trong submenu (dùng child combinator).
2. .menu > ul > li + li: border-left:1px solid #cbd5e1, padding-left:20px — chỉ mục cấp 1 KHÔNG PHẢI mục đầu tiên (Sản phẩm, Liên hệ có viền trái; Trang chủ thì không).
3. .submenu a[href^="#sale"]: color:#dc2626, font-weight:700 — chỉ liên kết trong submenu có href bắt đầu bằng "#sale".
4. .menu ul li a: text-decoration:none — áp dụng cho MỌI liên kết trong menu (cả cấp 1 lẫn submenu) bằng bộ chọn hậu duệ.