| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | ||||
| 4 | 5 | 6 | 7 | 8 | 9 | 10 |
| 11 | 12 | 13 | 14 | 15 | 16 | 17 |
| 18 | 19 | 20 | 21 | 22 | 23 | 24 |
| 25 | 26 | 27 | 28 | 29 | 30 | 31 |
- node-sass #sass #사스
- 클릭display:none #클릭하면버튼노출
- CSS버튼애니메이션 #버튼클릭하면
- 버튼클릭하면박스나타남 #버튼클릭시박스노출 #버튼클릭시아래버튼밀어내림
- 자바스크립트객체배열로
- git remote: Permission to .. denied to error: 403 에러
- JSON.parse()
- 바닐라자바스크립트 텍스트 바꾸기
- JSON.stringify()
- 부트스트랩 프로그레스바
- #push() 함수 #Object.keys()함수 #Object.values()함수 #Object.entries()함수
- nginx설치
- 이미지유무체크
- 바닐라자바스크립트
- PHP에서데이터로그
- 자바스크립트객체를문자열로
- 체크박스
- 빗버킷ssh
- animation progressbar
- nginx와php연동
- CSS버튼효과
- vanillajs
- nginx루트경로변경
- node-sass #dart-sass
- 애니메이션프로그레스바
- PHP설치
- Today
- Total
목록👉 css.scss.sass (6)
●▲■ 개발일기
See the Pen flex: 1 by Lee sangmin (@sangmin2) on CodePen. See the Pen flex: 1 by Lee sangmin (@sangmin2) on CodePen.
[SASS] node-sass 지원종료! dart-sass 권장.
오랜만에 node-sass를 쓸일이 생겨 npm run compile:sass를 실행하니 계속 에러뜸.ㅠ 에러가 자주 발생했던 노드싸쓰라 지웠다가 다시 설치하면 잘 되었었다. 하지만 오늘은 여러가지 에러문구가 뜨면서 설치가 잘 안되었다. 한참을 구글링하다가 보니 더이상 지원을 안한다는 걸 알게됨. 대신에 dart sass 방식의 설치를 권고한다고 한다. 기존 node-sass는 삭제하고 나서 아래 명령어 실행. npm install sass -g 인스톨이 잘 되었다면 실시간 컴파일 명령어는 아래와 같다. sass --watch 폴더명/style.scss:폴더명/style.css
버튼 클릭하면 박스가 나타나면서 아래 박스 부드럽게 밀어내리는 애니메이션 CSS box2 Lorem ipsum box1 box2 Show! See the Pen Untitled by Lee sangmin (@sangmin2) on CodePen.
https://www.npmjs.com/package/node-sass node-sass Wrapper around libsass. Latest version: 7.0.1, last published: 2 months ago. Start using node-sass in your project by running `npm i node-sass`. There are 11886 other projects in the npm registry using node-sass. www.npmjs.com 우선 node-sass를 쓰면서 느낀 건 css를 작성하면서 번거롭고 불편했던 부분들이 조금 해소되었다는 점. 1. css에서는 자식 class를 추가할 때 앞에 부모 class를 일일이 적어줘야 하는 번거로움. (e..
보통 버튼을 클릭하면 컬러가 바뀌거나 버튼 사이즈가 변한다. 커서가 손가락 모양으로 바뀌는 건 cursor: pointer; 를 적용하면 되지만 버튼 배경색이 변한다거나, 버튼 사이즈가 커졌다 작아졌다 하는 건 CSS로 적용해줘야 한다. .클래스명:active {변경하고 싶은 스타일;} 버튼 클릭 테스트 01 버튼 클릭 테스트 02
클릭하면 display: none을 block으로 변경합니다. I'm hidden document.querySelector('.trigger').addEventListener('click', function(){ document.querySelector('.hidden').classList.remove('disappear'); document.querySelector('.hidden').classList.add('appear'); }); document.querySelector('.hidden').addEventListener('click', function() { const target = this; if (target.classList.contains('appear')) { target.classLi..