본문 바로가기

전체 글

link를 걸어주는 <a></a> 태그에 대해서 알아보자 ! 태그는 다른 페이지라던가 같은 페이지의 어느 지정된 부분, 파일 , 이메일, 전화번호 등 다른 곳으로 연결해주는 하이퍼링크를 설정할 수 있다. 태그의 중요한 속성으로는 href(hypertext reference) 속성 값으로는 이동할 곳의 link를 연결해주면 된다. taget 속성은 링크 된 페이지를 현재 창에 띄울지 아니면 새 창을 열 것인지를 결정한다 속성값으로는 새창을 여는 _blank 현재페이지에서 바로 넘어가는 _self 가 있다. 기본값은 _self 다. 이외에 download , hreflang , rel , type 속성이 있다. 태그는 inline 요소이지만 버튼 형태의 모습으로도 많이 쓰이며 버튼 형태로 쓰일 때에는 display 값을 block 으로 바꿔서 사용된다. 더보기
목록이나 표를 만드는 Tag 들 ! 1. , , 태그는 orderlist로 순서가 있는 목록을 작성할 때 사용한다. 태그는 unorderlist로 순서가 없는 목록을 작성할때 사용한다. 태그와 태그는 자식으로 태그를 가진다. 태그는 단독으로 사용할 수 없고 부모 요소로 , 태그가 와야 한다. 태그 안에 , 태그가 또 들어갈 수 있다. 2. 태그는 표를 만들 때 표의 영역을 설정하기 위해 사용된다. 태그에 css로 border-collapse: collapse; 라고 작성하면 표의 행과 칸의 사이사이의 여백을 제거해줄 수 있다. 3. 태그 안에 작성하며 표의 행을 설정할 때 사용된다. 태그의 개수가 그 표의 행의 개수를 의미한다. 4. , , 태그는 태그 안에 작성하며, , 태그 모두 표의 칸을 만들어 준다. 표를 작성했을 때 머리에 해당하.. 더보기
html을 시멘틱하게 작성하기 위한 Tag들! 1. 일반적으로 문서의 제일 윗부분을 정의할 때 사용된다. header 태그안에 header와 footer를 자식 요소로 넣으면 안 된다. 2. 일반적으로 문서의 제일 하단부분을 정의할 때 사용된다. footer 태그안에 header와 footer를 자식 요소로 넣으면 안 된다. 3. ~ 총 6단계의 문서 제목을 표현한다. 숫자가 커질수록 작은 주제 ! 숫자가 작을수록 font-size 가 크지만 font-size를 조절하기 위해서 사용해서는 안된다! 태그를 사용했으면 바로 이런 식으로 중간을 뛰어넘지 말고 을 사용했으면 다음으로는 다음으로는 이런 식으로 사용한다. 4. 문서의 핵심 주제에 직접적으로 연관돼있는 콘텐츠들을 구성할 때 사용된다. 문서에 하나만 존재해야 한다. ie를 지원하지 하지 않아서 잘.. 더보기
Block 요소와 Inline 요소 ! 1. block 요소의 특징 사용 가능한 최대 가로너비를 사용함! 크기를 지정할 수 있다. 기본 값은 width: auto , height: auto 지만 block 요소는 width : 100% , height: 0으로 시작! 요소가 수직으로 쌓인다. margin, padding 값을 위 아래 좌우 모두 사용 가능하다. 레이아웃을 잡는 용도로 많이 쓰인다. 2. inline 요소의 특징 content를 표기하기 위해 필요한 만큼의 너비만 사용함! 크기를 지정할 수 없다. (width 값과 height 값을 줘도 반응이 없음) 기본값은 width: auto , height: auto 지만 inline 요소는 width : 0 , height: 0으로 시작! 요소가 수평으로 쌓인다. 줄 바꿈을 해서 작성하.. 더보기