Programming310 [CSS] 박스 모델의 너비 박스 모델의 배치를 위해서는 박스 모델의 너비를 이해해야 합니다. 높이는 한 줄에서 가장 긴 높이를 기준으로 맞추겠지만 너비는 좌우 배치에 영향을 주기 때문입니다. box-sizing: 속성 값; 박스 모델의 너비를 결정하는 속성입니다. 지난 포스트 중에서 박스 모델 콘텐츠 영역의 너비(클릭하면 링크)를 지정하는 width라는 속성을 다뤘었습니다. 그런데 이 width라는 속성은 콘텐츠 영역만 조정하고 다른 박스 모델에는 영향을 주지 않습니다. 그래서 이 box-sizing 속성을 이용하여 width가 적용되는 범위를 조정합니다. 올 수 있는 속성 값은 이하 두가지 입니다. 속성 값 효과 content-box width속성의 범위를 콘텐츠 영역만 적용합니다. (기본 값) border-box width속성.. 2021. 1. 28. [Javascript] 주석 본격적인 문법에 들어가기 앞서 마지막으로 자바스크립트의 주석을 알아보겠습니다. 1. 단일행 주석 '//' 한 문장을 주석 처리할 때 이용합니다. //console.log("자바스크립트 주석 처리하기"); 2. 복수행 주석 '/* ~ */' 한 문장이상을 주석 처리할 때 이용합니다. /* console.log("안녕"); */ /* console.log("안녕1"); console.log("안녕2"); */ /* * console.log("안녕1"); * console.log("안녕2"); * * */ 2021. 1. 27. [Javascript] 자바스크립트의 기본 규칙 다른 언어와 마찬가지로 자바스크립트에도 간단한 규칙이 있습니다. 1. 한 문장의 명령이 끝나고나서는 세미콜론(;)을 붙인다. 자바스크립트는 세미콜론이 붙지 않아도 코드의 실행과정에서 문제가 생기지 않습니다. 그러나 문장 종료를 명확히 하기 위해서 세미콜론을 붙이는 것을 권장하고 있습니다. 다음 두 명령은 모두 정상적으로 실행됩니다. console.log("안녕1") console.log("안녕2"); 2. 대문자와 소문자를 구별한다. 자바스크립트는 대문자와 소문자를 엄격하게 구분합니다. 다음 두 명령은 같아보이지만 전혀 다른 명령이 되게됩니다. console.log("안녕"); console.Log("안녕"); 3. 한 줄에 한 문장만 기술한다. 자바스크립트는 한 줄에 여러문장이 와도 정상적인 구동이 가.. 2021. 1. 27. [CSS] 박스 모델 html/css를 처음 다룰때 인라인 요소와 블록 요소를 다뤘었습니다. 이 중 블록 요소는 한 칸을 차지하며, 자동 줄바꿈이 이루어진다고 했습니다. 그래서 블록 요소를 살펴보면 웹 페이지에서 박스 모양의 공간을 가지게 되는데 이런 요소들을 박스 모델이라고 부릅니다. 인라인 요소와 블록 요소에 대한 설명은 아래 링크로... 2020/08/18 - [Programming/HTML,CSS] - [HTML/CSS] 블록 요소와 인라인 요소 마진과 패딩, 테두리를 조작하는 속성 2021/01/25 - [Programming/HTML,CSS] - [CSS] 마진(margin)과 패딩(padding) 2021/01/25 - [Programming/HTML,CSS] - [CSS] 콘텐츠 영역 설정하기 2021/01/2.. 2021. 1. 27. [CSS] 테두리 속성 BORDER 콘텐츠와 마진, 패딩을 다루었고 이번엔 마진과 패딩의 사이 테두리에 대한 속성들을 다루려고 합니다. border-width: 속성 값; border-width 속성은 테두리의 굵기를 지정합니다. px등의 단위를 이용해 두께를 직접 지정하거나, thin/medium/thick의 키워드를 이용해 굵기를 지정할 수 있습니다. border-top/bottom/left/right-width를 통해 특정 위치의 굵기를 지정할 수 있습니다. border-style: 속성 값; border-style은 테두리의 모양을 지정합니다. 속성 값은 아래와 같으며 더 많은 속성 값은 링크에 있습니다. 속성 값; 효과 none 테두리 없음 (기본 값) dashed 대시( - )선으로 테두리 표시 dotted 점선으로 테두리 표시.. 2021. 1. 27. [Javascript] <script>태그의 위치 처음에는 지난 포스트에 3번 단락으로 넣을까 했는데 내용이 생각보다 방대해서 별개의 포스트로 빠졌습니다. 결과 부터 이야기하자면 (body의 닫는 태그)직전에 넣는 것이 좋다고 합니다. 들어가기 전에 개인적인 경험을 이야기하자면 배우는 과정에서 보통 사이에 넣는 책과 문서, 강의들이 많았는데 블로그를 기술하기 위해 뒤져보다 방법을 발견하게 되었습니다. 0. 2021. 1. 26. 이전 1 ··· 43 44 45 46 47 48 49 ··· 52 다음 300x250
