들블리셔님의 게시글

질문&답변

안녕하세요 질문있습니다 ㅠㅠ

.items{ .item1{} .item2{} .item3{} } 이런식으로 하셔야하는데 items를 각각 주셨네요! 오버하면 상세설명 나타나는 상품목록 .items { text-align: center; } .item { display: inline-block; width: 300px; height: 300px; border: 1px solid #ddd; position: relative; margin: 10px; } .caption { width: 300px; height: 300px; background-color: rgba(0, 0, 0, 0.7); position: absolute; top: 0; left: 0; color: #fff; padding: 20px; box-sizing: border-box; padding-top: 40px; opacity: 0; transition: 0.5s; } .caption a { color: #fff; background-color: teal; padding: 7px; border-radius: 3px; text-decoration: none; } .caption a:hover { background-color: #fff; color: #000; } .item:hover .caption { opacity: 1; } 라이언인형 Lorem ipsum dolor sit amet, consectetur adipisicing. Price : $12 $10 view detail 라이언인형 Lorem ipsum dolor sit amet, consectetur adipisicing. Price : $12 $10 view detail 라이언인형 Lorem ipsum dolor sit amet, consectetur adipisicing. Price : $12 $10 view detail 이렇게 한 번 해보셔요^^!!