HTML : Hyper Text Mark-up Language Hyper Text : 문서간 이동이 자유로움/ 다른 문서나 사이트로 즉시 이동할 수 있음 Mark-up : 코드를 작성하는 행위/ 태그(tag)를 사용하여 문서에서 어느 부분이 제목이고 본문인지 표시하는 것 =>즉, 웹에서 자유롭게 이동할 수 잇는 웹 문서를 만드는 언어 1. : 문서의 유...
[텍스트 관련 태그] 1. <hn>태그 : heading tag heading 태그는 1부터 6까지 크기별로 나눠진다. 2. <p>태그 : paragraph tag/ 단락 만들기 태그 단락과 단락사이 p태그와 p태그 사이에 공백이 생김 여러 개의 p 태그 작성시 p*개수 입력 후 tab키를 누르면 한꺼번에 태그가 생성된다.(다른 태그도 마...
1. 순서가 없는 목록만들기(Unordered List) 목록의 덩어리를 묶어주는 ul tag 덩어리 안의 각 항목을 list item을 이용해 표시한다. ul tag에서 형성되는 bullet(불릿)은 css에서 list-style-type속성을 이용해 변경가능하다. 기본형 예시 list 문서의 품질기준 문서는 문서 등재 기준을 충...
<img> tag :이미지 삽입하기 1. src 속성 : 이미지 파일 경로를 알려줌. *경로란 현재 html 문서에서 img 파일까지 찾아가기 위한 길 > 폴더명 / 이름.확장자명 (ex. jpg/png/gif) -하위폴더 : "/"로 구분 -상위폴더 : "../"로 구분 2. 이미지 사이즈 조절 속성 width(너비) & heights(높이) ...
1. <a> > <a> : anchor tag_하이퍼링크로 외부 주소로 연결해 주는 태그. 기본값 : 파란색 - 방문전 빨간색 - 활성링크(클릭하는 순간) &nbs...
하이퍼링크를 통해 각각 다른 페이지로 이동하게끔 하는 태그를 만들어보고자 한다. 1. 우선 첫번째로 각 링크를 통해 이동해야 할 문서를 먼저 만든다.[자리 만들기 먼저] 회사정보 -> index.html 문서 생성 제품정보 -> about.html 문서 생성 인재채용 -> recruitment.html 문서 생성 고객지원 -> cs.html 문서 생성 ...
기본적으로 문서에서 링크를 클릭하면 현재 열린 창에 연결된 링크의 페이지가 나타난다. 그리고 이전 문서로 되돌아가려면 뒤로가기를 눌러야하는 번거로움이 있는데, 이 때 보안이슈가 발생할 경우 뒤로가기를 하게 되면 링크가 안나오게 되는 경우가 간혹 발생한다. 이를 방지하기 위한, <a>의 속성 target을 살펴보도록 하자. explain...
이미지상의 클릭 위치에 따라 서로 다른 링크가 열리도록 하는 방법에 대해 알아보려고 한다. 이를 "이미지맵(imagemap)"이라고 함. > ①이미지에 map을 만들고 추가해야 함. → <map>이용 ②<img>에서 usemap속성으로 이미지 맵 지정 기본형 : <map name="맵이름"> &...
1. 기본적인 표 만들기 표를 이미지로 올리게 되면 수정이 어렵고 가독성이 떨어지기 때문에 문서로 mark-up하여 작업한다. 표를 만드는 태그를 활용하는데, <table>,<tr>, <td>, <th> 이 세가지 태그를 기본적으로 이용한다. > <table> : 표 전체의 자리 잡기(윤곽 형성) <tr> : table ...
1. <form>태그 사용자로부터 데이터를 받아서 이 정보를 처리하는 것으로 데이터베이스를 기반으로 한다. 폼 태그는 몇 개의 예외적인 요소를 빼면 전부 Inline 요소이다. > 기본형 **<form action="속성" method="속성">폼 요소들 1-1. input(1) < input type="유형" 속성="속성값"> t...
웹 폼 과 티셔츠 설문 올해 과 티(T)를 만들려고 합니다. 원하는
6. <textarea>태그 - 텍스트 영역 만들기(ex. 의견 남겨달라는 칸) > 기본형 : 내용 속성 name : 텍스트 영역의 이름 지정 cols : 텍스트 영역의 가로 너비 문자 단위로 지정 rows : 텍스트 영역의 세로 길이 줄 단위로 지정 textarea 빈센조 빈센조 까...
사이트에 이미지를 넣는 방법 💡 img 태그를 사용하는 것과 div태그에 background-image 속성을 추가하는 것. 두 가지 방법의 차이점은 무엇일까? 이 차이점을 알아보기에 앞서 Semantic Web(시멘틱 웹)과 Semantic Tag(시멘틱 태그)에 대해 알아보자. Semantic Web 차세대 지능형 웹. 컴퓨터가 이해...