HTML6 vscode 자동 들여쓰기 적용하기 1. vscode를 실행한다2. 좌측 하단에 톱니바퀴 아이콘 = 설정에 들어간다.3. 설정검색칸에 'formatter'를 검색한다.4. Editor: Default Formatter를 확인하고 아래 옵션에 Prettier - Code formatter를 선택한다.5. 작성하던 파일로 들어가서 Ctl+A로 코드 전체 선택하고 Shift+Alt+F를 누르면 자동 들여쓰기 완료! 2024. 5. 23. [TIL] div 사이즈 조정 시 padding 값 제외 하기 div태그에 width :1000px로 고정값을 줬는데padding 값을 따로 주니 div 크기가 더 늘어났다. 이럴때에는 해당 div태그의 css에box-sizing: border-box; 태그를 넣어주면 되는데padding이나 margin값을 줘도 크기가 더 늘어나지 않게 해준다. 2024. 5. 2. [TIL] github 배포 시 css와 javascript가 적용이 안될 때 개인과제를 끝내고 개인 github에 등록한 뒤 배포를 해보았다.그러나 css와 javascript 적용이 안되고 html 뼈대만 덩그러니 나타나는 현상이 일어났다. 아무래도 css 파일과 script 파일을 연결할때에 이상이 생긴 것 같다. 원래는 css파일과 script파일을 연결할때 '/'를 입력하여 자동으로 아래에 뜨는 파일들을 택해 넣었었다.그런데 하나의 폴더에 파일들을 다 넣었음으로 '/'는 없어도 연결이 가능하다.그래서 링크태그에 있는 '/'를 다 지웠다.원래는 이미지도 이미지폴더를 따로 만들어 넣었으나배포 시 똑같이 적용이 안되어 다시 꺼내왔다.폴더가 하나인데 폴더가 하나 더 있는 걸로 인식해서 배포할때 경로를 못 찾았던 것 같다. 문제해결!도움이 되셨길 바라며! 2024. 5. 1. [TIL] 웹꾸_파비콘 적용하기 웹페이지에 없으면 섭섭한 파비콘(Favicon)을 넣으려 한다. *파비콘(Favicon)이란 웹 페이지를 대표하는 작은 이미지로 웹 페이지 탭의 좌측에서 볼 수 있다. 우선 파비콘에 넣으려고 하는 이미지를 미리 다운로드하고파비콘으로 파일을 변환해주는 사이트에 접속한다.https://www.favicon-generator.org/ Favicon & App Icon GeneratorUpload an image (PNG to ICO, JPG to ICO, GIF to ICO) and convert it to a Windows favicon (.ico) and App Icons. Learn more about favicons.www.favicon-generator.org 파일선택란에 원하는 이미지 파일을.. 2024. 4. 26. [TIL] <ul>, <ol>, <li> 앞에 점 삭제하기 웹문서 작성 시 리스트를 나열하는 경우가 많다. 그래서 , , 코드가 많이 쓰이는데 이 코드들은 앞에 숫자나 영어, 점이 자동으로 붙는다. 웹 컨셉에 맞게 디자인 하려면 삭제하는 것이 좋은데 css에 list-style-type: none; 태그를 사용하면 없어진다. .empty { list-style-type: none; } -------------------------------------------------- 안녕하세요 감사해요 잘 있어요 다시 만나요 안녕하세요 감사해요 잘 있어요 다시 만나요 2024. 4. 17. [TIL] 배경 이미지 전체 채우기와 고정하기 style> body { background-image: url(https://images.freeimages.com/images/large-previews/529/nature-1492826.jpg); background-repeat: no-repeat; background-size: cover; } style> 위에 처럼 작성하면 전체 창 크기에서는 이미지가 화면 전체에 채워지지만창 크기를 축소하면 아래 사진처럼 화면 하단에 공백이 생긴다. 이미지를 중복없이 화면을 채우기 위해서는 background-attachment: fixed; 태그를 적용하면 된다.이 태그는 스크롤이 생겨 이동 시에도 배경화면이 고정되어 웹페이지를 깔.. 2024. 4. 16. 이전 1 다음
