html 다루는 것에 익숙해지려면 당연히 반복해서 따라하는 것 만큼 좋을게 없지 않을까 싶다.그래서 오늘은 농협 사이트를 한 번 따라 만들어 보자. code Language Banking 은행안내 윤리경영 금융소비자보호 기업지배구조 경영정보 ESG경영 채용정보 ..

display의 여러가지 속성을 사용하여 요소를 원하는 곳에 배치, 또는 나타나게 해보자. div 태그div 태그는 혼자서 한 줄을 차지하는 block 속성의 태그로 division, 즉 영역을 구분하기 위한 태그다.div태그만 단독으로 사용할시 p태그와 큰 차이가 없으며 주로 style과 여러 속성을 같이 사용하여 각 영역마다 다양한 스타일을 만들기 위해 사용한다.가장 많이 사용하게 될 것이고, 기본이 되는 태그이기 때문에 이 태그에 익숙해져야만 한다.  display의 다양한 속성display : 영역을 설정하여 화면에 출력했을때 보여지는 형태.block / inline / inline-blockblock 속성혼자서 한 줄을 차지한다.연속적으로 배치하면 세로로 배치된다.style을 이용하여 너비(wi..

a 태그를 이용하여 클릭하면 해당 경로로 접속되는 하이퍼링크를 만들어 보자.그리고 input 태그의 다양한 속성에 대해서 알아보자.   해당 영역을 클릭하면 지정한 경로로 이동한다.지금 코드에서는 td 안에 a 태그를 두었기 때문에 td 를 클릭하면 경로 이동된다. 돼지고기 [펼치기.접기] 돼지머리 목살 가브리살 등심 뒷다리살 항정살 갈비 갈매기살 안심 ..

웹 사이트를 제작할 때 이미지를 삽입해야 할 일이 꽤나 많을 것이다.그래서 오늘은 이미지 태그에 대해서 한 번 알아보자.  img 태그 <img src="그림파일경로" alt="대체텍스트" width="너비" height="높이"> 대체텍스트는 그림이 출력되지 않을때, 어떤 요소인지 글자로 알려주기 위해 사용 img 태그는 글자와 동일하게 취급한다. 그림옆에 그림을 둘 수 있음 이미지의 너비나 높이를 하나만 지정하면, 비율에 따라 나머지 크기가 설정됨 이미지의 너비와 높이를 모두 지정하면, 비율이 무..

html의 가장 기본이라고 할 수 있는 table에 대해 알아보자.여러가지 표를 만들어보면서 각각의 태그들 사용법을 익혀볼 것이다.아, 참고로 html의 IDE는 vscode를 사용해주었다. 테이블 태그 (표 만들기) 태그 설명 table 표의 시작과 끝을 나타낸다 tr table 내부에 한 줄을 생성 (table row) ..