본문 바로가기
728x90
반응형
SMALL

css2

옆에 둥둥떠다니는 리모컨네비게이션 만들기 네이버 웹툰을 보다보니 우측 하단의 빨간 네모처럼 리모컨형식의 사이드 네비게이션이 있다. 스크롤이 움직이더라도 항상 그 위치에 있다. 이것을 내가 자바스크립트와 자바, 서버등을 스스로 공부하면서 천천히 만들고있는 프로젝트에 적용해시키도록 하겠습니다. 최초 우측의 화면을 보면 div태그로 간단하게 만든 형태가있습니다. .sideRemoteController { height: 0%; width: 12%; /*너비*/ color: #333; /*내부글자 색*/ font-size: 12px; /*내부글자 크기*/ top: 35%; /*페이지에서의 상하 위치*/ left: 86%;}/*페이지에서의 좌우 위치*/ 최초 위치와 크기를 잡는 정도로만 작성했습니다. 주석을 통해 각 내용이 어떤것을 의미하는지 작성했습니다.. 2022. 3. 6.
AUTOPREFIXER CSS에서 비교적 최신 기능을 사용하려면 벤더 접두사(Vendor Prefix) 가 붙은 이름을 사용합니다. 벤더 접두사를 붙이는 것은 create-react-app 에서는 autoprefixer 패키지를 통해서 벤더 접두사가 자동으로 붙습니다. create-react-app 에서 최신 CSS 기능을 사용했을 때 실제로 벤더 접두사가 자동으로 붙는지 확인해 보겠습니다. 최신 CSS 기능을 사용했을 때 실제로 벤더 접두사가 자동으로 붙는지 확인해 보겠습니다. src 폴더 밑에 test.css 파일을 만들고 다음 내용을 입력한 후 App.js 에서 test.css 파일을 가져오면 되겠습니다. .prefix-example { writing-mode: horizontal-tb; scroll-snap-type: .. 2022. 1. 21.
728x90
반응형
LIST