👤

美味しいHTMLの書き方

HTMLcafe official

10万回視聴 • 1日前

CSSでラテアート

Cafe Staff

5万回 • 3時間前

JavaScriptの苦味を消す

Master JS

20万回 • 1週間前

body { margin: 0; font-family: sans-serif; background-color: #f9f9f9; } .header { display: flex; justify-content: space-between; align-items: center; padding: 10px 20px; background: #fff; position: sticky; top: 0; } .container { display: flex; } .sidebar { width: 200px; height: 100vh; padding: 20px; background: #fff; } .sidebar ul { list-style: none; padding: 0; } .sidebar li { padding: 10px; cursor: pointer; } .content { flex: 1; padding: 20px; } .video-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 20px; } .thumbnail { background-color: #ddd; aspect-ratio: 16 / 9; border-radius: 12px; } .video-info { display: flex; margin-top: 10px; } .user-avatar { width: 36px; height: 36px; background: #ccc; border-radius: 50%; margin-right: 12px; } .text h3 { font-size: 14px; margin: 0; } .text p { font-size: 12px; color: #606060; margin: 4px 0; }