본문 바로가기

HELP/SITE5

[CSS-CLIP-PATH MAKER] CSS polygon 만들어주는 사이트 https://bennettfeely.com/clippy/ Clippy — CSS clip-path maker About Clip Paths The clip-path property allows you to make complex shapes in CSS by clipping an element to a basic shape (circle, ellipse, polygon, or inset), or to an SVG source. CSS Animations and transitions are possible with two or more clip-path shape bennettfeely.com css 에서 좌표나 위치 지정해서 무언가 효과를 줘야 하거나 작업을 해야 할때, polygon을 사용 하게 된다.. 2023. 1. 30.
[GRADIENT] 그레디언트 조합이 어려울때 https://uigradients.com 그레디언트 조합을 추천해주는 사이트다. .bg{ background: #EDE574; /* fallback for old browsers */ background: -webkit-linear-gradient(to bottom, #E1F5C4, #EDE574); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to bottom, #E1F5C4, #EDE574); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ } 코드표를 클릭하면 그 색상만 따로 복사를 할 수도 있고, 코드 블럭 모양 아이콘을 클릭하면 해당 부분 css.. 2022. 12. 2.
[정규식] 정규표현식 모음사이트 https://ihateregex.io/ 2022. 11. 25.
[BOX-SHADOW] 그림자효과가 어려울때 https://getcssscan.com/css-box-shadow-examples css로 박스쉐도우 주기 까다롭거나 이쁘게주는 방법을 모르겠을때, 가끔씩 이용하는 사이트이다. .text{ box-shadow: rgba(100,100,111,0.2) 0 7px 29px 0px; } 원하는 효과 스타일의 그림자가 표현된 박스를 클릭하면 값이 복사가 되는데, [ctrl+v] 를 하면 box-shadow 값을 가지고 올 수 있는 것을 볼 수 있다. 2022. 11. 25.
[HTML 디자인 및 마크업] 더미이미지 사이트 https://placeholder.com/ 웹페이지 제작에 사용되는 더미 이미지로 이미지들을 표기 하는게 아닌 box에 규격 및 색상등 간단하게 표기 할 수 있다. 사용 방법은 간단하다. https://via.placeholder.com/ 해당 URL 뒤에 / 사이즈 / 색상코드.(png jpg) / 글씨색상 순서로 입력 해주면 된다. image test 2022. 11. 25.
728x90