728x90 반응형 전체 글394 [SASS] 상단 메뉴바 생성과 position 이해 ( X버튼 추가 ) HTML 🌸카카오톡 채널 추가 시 3천원 쿠폰 즉시 발급🌸 X 닫기 버튼인 X 버튼도 추가해줌. ( 나중에 자바스크립트로 닫기 해 줄 버튼 )position: absolute를 사용하여 close 버튼을 배치@use "reset";/* 색상 변수 */$main_color: #f5e44f;$sub_color: #e33258;/* header */.banner-top { background-color: $main_color; width: 100%; padding: 11px; text-align: center; font-size: 12px; display: block; // 나중에 자바스크립트로 건들.. 2024. 6. 19. [SASS] _reset 파일과 SASS 문법 reset 파일 - 후에 @use 로 임포트 해줌.- 파일이름은 _reset.scss 으로 생성./* CSS - 기본 설정 */* { margin: 0; padding: 0; box-sizing: border-box; position: relative; // pointer-events: none; text-decoration: none; list-style: none;}html { font-size: 16px;}a,a:link,a:visited { color: inherit; //하단 밑줄 색깔 없애기}전체에 position:relative 를 준 경우 주의 사항 전체 요소에 position: relative를 적용하는 접근은 일반적으로 권장되지 않음.필요한 요소에만 position: r.. 2024. 6. 19. [SASS] 상단 바 만들기 HTML 🌸카카오톡 채널 추가 시 3천원 쿠폰 즉시 발급🌸 전체 감싸는 div = wrapper header 안에 들어 갈 것div .banner-top ( 문구 ) 뿐만 아니라 X 버튼 div 도 추가해줄 예정.SASS@use "reset";/* 색상 변수 */$main_color: #f5e44f;$sub_color: #e33258;/* header */.banner-top { background-color: $main_color; width: 100%; padding: 11px; text-align: center; font-size: 12px;}가운데 정렬을 하기 위해서text-align: cent.. 2024. 6. 18. [CSS] Pseudo, 이벤트 정리 Pseudo Class Pseudo Class - 가상 클래스: hover 할 때 , : ( 콜론) 이 하나 들어가는 것들을 CSS의 가상 클래스 라고 함.:active= 사용자에 의해 엘리먼트가 활성화 됐을 때( 마우스를 누르는 중일 때 ):hover= 사용자의 커서가 엘리먼트 위에 있을 때( 마우스가 올라가 있을 때):target= 상호작용된 요소가 가리킨 URL과target 요소가 일치할 때 사용되는 가상 class:any-link= link / visited 이 두개를 포괄하는 가상 class= 방문 여부와 관계없이 링크가 걸린 요소 전부의 style 적용 가능:checked= 대상 체크박스가 체크됐을 때:focus= 대상 요소가 활성화됐거나 된 직후일 때:focus-within= label/fo.. 2024. 6. 17. [CSS] display: inline 과 inline-block 차이 display: inline 하고display: inline-block 차이display: inline = 딱 자기 컨텐츠 영역만 차지 = 가로 정렬이 된 것처럼 보임. = 높이가 지정이 안됨. - 높이를 지정해도 설정이 되지 않음.display:inline-block - 자기 컨텐츠 만큼 차지 - 높이 값 지정 가능= 인라인 요소지만, 블록 속성 가짐. = 높이 값을 바꿔주지 못했던 기존 인라인 요소와 달리 블록 속성이 추가돼서 하위 값을 지정할 수 있음. = 인라인 요소기 떄문에 자기 컨텐츠 만큼 차지를 해서 가로 정렬처럼 보임. = 중간에 인라인 요소가 끼어든다면, 해당 요소에 높이값은 지정되지 않은 채 차이를 보이게 됨. 2024. 6. 17. [깃] Git 설치 및 설정 및 이름 변경 참고 블로그 사이트: https://code-lab1.tistory.com/249#google_vignette [Git] 윈도우10(window 10) 깃(Git) 설치하기 - Git 기초(0.5)윈도우 10(Window 10) 깃(Git) 설치하기 1. Git 설치 파일 다운로드 윈도우 10에서 깃은 공식 홈페이지에서 다운로드할 수 있다. https://git-scm.com/downloads Git - Downloads Downloads macOS Windows Linux/Unix Older releasescode-lab1.tistory.com상단의 Click Here to Downlaod 눌러서 설치.설정 이대로 하고 Next 다 Next 하고 install 해주면 됨.설정하기 git config -.. 2024. 6. 16. [깃] VsCode의 기본 터미널 설정 vscode 연 다음Ctrl + shift + P VS Code에서 Ctrl + Shift + PSelect Default Profile 검색하여 선택 원하는 설정 선택= powershell 로 선택함. 2024. 6. 16. [깃] 깃허브 한번에 이해시켜드리고 포트폴리오 올리는 법 깃, 깃허브 한번에 이해시켜드리고 포트폴리오 올리는 법까지 알려드림. 15분안에 당신은 Github 전문가가 됩니다 (youtube.com)Git 명령어 총정리집 (by 코딩알려주는 누나❤) - HackMD Git 명령어 총정리집 (by 코딩알려주는 누나❤) - HackMD# Git 명령어 총정리집 (by 코딩알려주는 누나❤)  안녕하세요 여러분 :)hackmd.io깃허브의 역할프로젝트 올리기Repositories 에서 New 버튼Repositories 에서 New 버튼 클릭플젝 이름 써주기 이름을 써주고전체공개를 할 건지 비공개를 할 건지 설정.공개로 돌리기.public 설정 후 repository 생성하기.. 2024. 6. 15. [깃] 깃허브 닉네임 바꾸기 프로필 클릭 - Settings깃허브 프로필 눌러서Settings 들어가기Account - Change username 2024. 6. 15. 이전 1 2 3 4 5 ··· 44 다음 728x90 반응형
