HTML6 [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] var, let, const의 차이 var, let, const는 스크립트에서 변수를 할당할 때 쓰이는 예약어이다. 그런데 var 예약어는 잘 사용하지 않는다. 그 이유는 다음과 같다. var 예약어 사용 시 실수로 빼먹게 되면 지역변수(로컬변수)가 전역 변수(글로벌변수)가 될 수 있고 프로그램이 길어지면 중간에 변수가 재선언 되거나 재할당 되어 오류가 발생한다. 이를 방지하기 위해 let과 const를 사용한다. let 예약어로 선언한 변수는 변수를 선언한 블록({}로 묶은 부분)에서만 사용 가능하고 블록을 벗어나면 사용할 수 없다. 또 재선언은 할 수 없지만 재할당은 가능하다. const는 변하지 않는 상수변수다. 그래서 값을 여러번 바꿀 때에는 let을, 고정된 값이면 const를 사용하면 된다. [참고문헌] Do it! 한권으로 끝.. 2024. 4. 18. [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 다음
