728x90 Web 개발40 <Script> / differ 속성 안녕하세요! HTML/CSS도 어느 정도 정리가 끝나서 슬슬 자바스크립트 공부를 시작하려 합니다. 자바스크립트 파일(.js)을 HTML에 연결하는 방법을 정리해보겠습니다. 자바스크립트는 CSS와 비슷하게 가 body안의 를 읽기 전에 실행되어 id를 못 찾아 나오는 문구입니다. 를 body의 마지막에 두면 정상적으로 글자를 읽어올 것입니다. (물리적 방법) 또는 위치는 그대로 head안에 두면서 처럼 defer를 추가하면 해결이 됩니다. defer는 html문서를 전부 분석(파싱)한 후에 2021. 5. 24. HTML/CSS - Inline/block 안녕하세요, display 요소가 많이 헷갈려 간단히 정리해보려 합니다 이전에 자세히 정리한 것은 아래 링크 참고 부탁드립니다. HTML/CSS - display HTML/CSS - display 안녕하세요, HTML/CSS에서 속성을 나타내는 display에 대해 공부하겠습니다. display의 종류는 여러 가지가 있는데요, (inline/block/inline-block/flex/list-item/none 등) 그중 많이 쓰는 것들만 한번 알아보겠.. hooni40.tistory.com Block 요소 -. , , 등이 있다. -. 사용 가능한 최대 가로 너비를 사용한다. -. 크기를 지정 가능 -. 수직으로 쌓임 -. margin, padding 속성 위, 아래, 좌, 우 조절 가능 -. 레이아웃을.. 2021. 5. 22. HTML/CSS - Position 안녕하세요, 오늘은 position에 대해 정리하려 합니다. position 설정을 해주지 않으면 요소들은 static position 상태입니다. [포지셔닝이 안 된 요소] 여기 상태에서 Relative/Fixed/Absolute 등 position 설정이 가능합니다. [포지셔닝이 된 요소] ◆ Relative position : 원래 자신의 자리를 기준으로 위치를 잡는 것 위와 같이 blue 클래스에 relative 포지션을 적용하면 아래와 같이 결과가 나오게 됩니다. (blue 박스가 초기 위치에 상대적으로 이동하게 됩니다 [위로 50px, 왼쪽으로 70px 공간이 나오게 이동] ) ◆ Fixed position : 브라우저 윈도우를 기준으로 위치를 잡는 것 ◆ Absolute position : .. 2021. 5. 18. HTML/CSS 가운데 정렬 정리 가운데 정렬이 너무 헷갈려서 display 요소별로 정리해놓으려 합니다. 가로 가운데 정렬 inline 요소 : inline 또는 inline-block 요소면 부모 태그에 text-align: center; block 요소 : margin-left: auto;, margin-right: auto; 사용 세로 가운데 정렬 1. vertical-align: middle; 이용해서 부모 요소의 텍스트와 가운데를 맞춘다 x Hello! My name is young. 2. 이것을 화면의 가운데로 정렬하려면 세로 길이가 100%인 요소를 만든 후 그 요소에도 vertical-align: middle; 적용 x Hello! My name is young. 또 다른 방법으로는. info를 inline-block으로.. 2021. 5. 16. 이전 1 ··· 5 6 7 8 9 10 다음
