본문 바로가기

전체 글45

이클립스 코드 어시스턴트 설치 및 설정 이클립스는 자바스크립트 함수 자동 완성을 지원하지 않기 때문에 별도로 어시스턴트 설치가 필요하다. https://github.com/angelozerr/tern.java/releases/download/tern.java-1.2.1/tern.repository-1.2.1.zip 에서 파일을 다운받아 설치한다. 먼저, 이클립스에서 Help - Install New Software를 클릭한다. 그 후, Install창이 뜨면 Add버튼을 누른다. Add Repository창이 뜨면, Add Repository창에서 Name : Tern이라고 적고, Archive 버튼을 눌러 다운받은 zip파일을 선택한 뒤 Add버튼을 누른다. 파일을 추가했다면 설치할 항목들을 모두 체크하고 계속 나오는 Next 버튼을 누른 .. 2022. 6. 21.
CSS3 레이아웃 Block 과 Inline block : 한 줄을 전부 차지 ,,,,,,,,, 공부를 좀 재밌게 하는 방법이 없을까? 이것저것 해보면서 재미를 붙여보는 게 어때애?! 솔직히 문과 공부보다는 재밌을 수밖에 없을텐데 그치그치?! 기술이잖아. 배우면 는다고! div1 div2 div3 div4 레이어(z-index) : 레이아웃이 겹칠 때 태그 { z -index : 값 } : z-index가 클 경우 위에 표시되고, z-index가 낮은 경우 가려진다. (3차원 큐브도형의z축) OverFlow 블록1 블록2 블록3 블록4 블록5 레이아웃 nav content footer 제주도 민박 가장 제주다운 민박집 이용안내 객실소개 예약방법 예약하기 제주 민박 소개 제주 서귀포 게스트 하우스형식의 현대적 민박집을 소개.. 2022. 6. 20.
CSS - 박스 모델 박스 모델 - 웹 브라우저는 HTML 내의 요소들을 사각형으로 간주하고 웹 페이지에 출력시킨다. - 요소들을 박스 형태로 그리는 것을 박스 모델이라 한다. - 박스는 배치, 색상, 경계 등의 속성을 가진다. - 각 박스는 margin(바깥쪽 여백),border(경계선),padding(안쪽 여백)을 가진다. - 경계선(border) - 경계선과 내용 사이의 간격 : 안쪽여백 (padding) - 요소와 요소 사이의 간격 : 바깥여백(margin) - 스타일 측면에서 문서는 하나 이상의 엘리먼트 박스(body)들로 구성되어있다. - 안쪽 박스 모델 영역은 바깥쪽 상위 박스 모델의 내용 영역 안으로 제한됨 (박스 안에 박스가 포함되어 있을 수 있음) 예) 상위박스중간제일안쪽 박스 모델 스타일 속성 width .. 2022. 6. 16.
CSS 기본 예제 CSS 기본 예제를 통해서 어떤 화면이 출력되는지 확인해보자 예제 1) - 와 태그는 인라인 요소 - 태그는 블럭 요소 - >(gt;) 직계 자손을 가리킴 - a:hover (마우스가 태그 위에 올라갔을 때) / a:link(링크로 연결) / a: active(마우스 클릭 시 효과)/ a:visited(한 번 이상 방문한 링크) 버튼1 버튼2 버튼3 버튼4 버튼5 버튼6 버튼7 버튼8 예제2 - 스타일 적용 우선순위 : 인라인 > 내부 스타일 시트 > 외부 스타일 시트 - 실습 스타일 시트 내부 스타일 시트에 의해 적용됩니다. 실습 외부 스타일 시트에 의해 적용됩니다. @charset "UTF-8"; h1 { color: red; } p { color: #0026ff; } 예제3 - id는 클래스와 달리.. 2022. 6. 15.

티스토리툴바