HTML5/CSS3

총 386개의 글

SVG 이미지 최적화 가이드
svg

SVG 이미지 최적화 가이드

# SVG 이미지 최적화 가이드 SVG 파일 용량을 줄이는 두 가지 방법을 정리합니다. ## 1. npx 명령어로 즉시 압축 (권장) ### 설치 없이 바로 사용 ```bash # 단일 파일 압축 npx svgo i

1312
CSS

transition: 100ms;

transition: 100ms;이 속성은 CSS에서 트랜지션(transition) 효과를 지정하는 것으로, 요소의 속성이 변경될 때 100ms(밀리초) 동안 부드럽게 변화하도록 설정하는 것이다.기본 문법:css코드

143
게시판 리스트를 CSS Grid로 만들어 보자(designed by Claude)
CSS

게시판 리스트를 CSS Grid로 만들어 보자(designed by Claude)

디자인을 처음에 잘 몰라서 클로드에게 물어봤습니다.클로드가 디자인 설계를 해줬습니다. (만들고나서 보니 이 간단한 것도 잘 생각이 나지 않는 수준인거 같아서 머리가 잘 안 돌아가는거 같군요. )https://code

161
CSS

Aspect Ratio를 알아보자

https://velog.io/@planic324/Aspect-Ratio를-알아보자📌 aspect-ratio 속성값 설명aspect-ratio는 CSS에서 요소의 가로와 세로 비율을 지정하는 속성입니다.비율 값은 가

146
SNS 공유 버튼
Script

SNS 공유 버튼

참조코드<div class="sns-share-buttons"> <!-- 네이버 블로그 공유 --> <a href="https://share.naver.com/web/shareView.nhn?url=https://e

172
CSS

CSS Grid를 배워보는 링크

https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-rowshttps://developer.mozilla.org/ko/docs/Web/CSS/CSS_Gri

253
swiperjs

swiper random shuffle

https://shra.ru/2021/03/peremeshivaem-slajjdy-pered-nachalom-raboty-v-swiper-js/

242
swiperjs

swiper.js 기본 템플릿 코드

https://codepen.io/eond/pen/bGKKevy See the Pen Untitled by eond (@eond) on CodePen. 출처 : https://lpla.tistory.com/147위

543
CSS

safari select background glory style

맥북 사파리를 쓰다보니 사파리에서의 select 태그는 모양이 좀 다르더군요.background: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1

356
SVG PATH EDITOR (코드로 SVG 패스 만들기)
svg

SVG PATH EDITOR (코드로 SVG 패스 만들기)

SVG PATH EDITOR(이하 'SPE')는 브라우저에서 직접 점을 찍고 PATH 커브를 지정할 수 있습니다.처음 브라우저를 열면 칼이 나오는데 좌측 상단 PATH 입력칸을 지우면 모두 지워집니다.그리고 COMM

988
위지윅에디터

ckeditor5

https://ckeditor.com/docs/ckeditor5/latest/installation/advanced/alternative-setups/predefined-builds.html#classic-editor

218