전체 글38 scss, 그룹 재사용 선언 @mixin 재사용할 그룹을 선언할 때에는,@mixin 변수명 { 설정값 내용 입력;}으로 사용하고, 코드 안에 @include를 선언하여 선언한 @mixin의 변수명을 입력해 불러와 사용한다. => 믹스인은 프로그래밍에서, 특정 기능을 다른 클래스나 컴포넌트에 삽입하여 재사용할 수 있도록 해주는 개념입니다. 다중 상속의 한계를 극복하고, 코드를 재사용성을 높이는 데 사용됩니다.믹스인의 장점은 여러 인터페이스가 동일한 메서드와 속성을 포함하는 API 디자인을 단순화하는 데 사용할 수 있다는 부분입니다. @mixin에 매개변수, 인수 사용하기 이런 식으로 사용 가능하다. 2025. 5. 8. scss 세팅하기, 기본서 https://github.com/glenn2223/vscode-live-sass-compiler/blob/HEAD/docs/settings.md vscode-live-sass-compiler/docs/settings.md at e2d6ac7d731a18f2498adddc7bacf239919f721f · glenn2223/vscode-live-sass-compilerCompile Sass or Scss file to CSS at realtime with live browser reload feature. - glenn2223/vscode-live-sass-compilergithub.com 1. vscode에서 확장 프로그램 다운로드2. 확장 프로그램 > 설정> 확장 설정3. settings.json에서.. 2025. 5. 7. AOS 사용하기, 데이터값 활용하기 스크롤 했을 때 오브젝트가 보이도록 만들기. https://michalsnik.github.io/aos/ AOS - Animate on scroll libraryAOS Animate On Scroll Library Scroll downmichalsnik.github.io하단스크롤 후 ,를 html에 복붙한다. css값을 설정하고 html 적용하고자 하는 값의 태그에 데이터값을 넣어준다.기본적인 데이터 값 이외에 사용하고자 하는 애니메이션 속성이 있다면 커스텀하여 사용해준다. data-aos="fade-up"//애니메이션 효과 data-aos-offset="200"//애니메이션이 시작될 scroll위치 (화면 하단에서부터의 거리) data-aos-delay="50"//지연효과.. 2025. 4. 16. CSS박스쉐도우 5px 5px 10px rgba(0, 0, 0, 0.4) 0 0 20px rgba(0, 157, 255, 0.5) 5px 5px 0 #98ccff; inset 0 0 10px rgba(0, 0, 0, 0.4); inset 0 0 10px #fff; inset 0 0 100px #000; 2025. 3. 14. 이전 1 2 3 4 ··· 10 다음
