프로그래밍 첫걸음 2주차
HTML 뼈대만들기
HTML은 기본 틀 태그로는 header 맨위 도입부에 들어가는 해드라인 그리고 그 밑으로 <h1~h6> 태그로 소제목이나 텍스트를 입력 할 수 있다
h 뒤에 붙는 숫자가 클 수록 의미강조 가 작다.
태그를 이용하여 텍스트를 입력하다가 문단 줄 바꿈이 필요 할때는 br 태그를 이용하여 줄 바꿈을 할 수가 있다
(Enter) 라고 생각 하면 될 것 같다
닫는 태그가 필요 하지 않다 여러번 사용 하면 그만큼 줄바꿈이 적용된다.
p 태그는 보통 문단 덩어리를 그 한 문단의 정보를 부여한다 보통 문단을 구분할때 사용 되는듯 하다.
예민한 저작권 출처는 cite 태그로 표기 해줄 수 있다.
HTML 기본 틀 태그2
또 보통 개인적으로 눈에 들어왔던 태그중 일단 mark 태그는 정보를 좀더 강조 해줄 부분에다가 넣어주면 될것 같다
그러면 형광팬으로 칠한 듯한 모습으로 보이게된다.
또한 hr 이라는 태그로 가로선 을 그을수가 있는데 주제 나눌때 쓰이는 듯 하다. 하지만 단순 밑줄 치는것을 필요로 하면 css로 이용해보면 좋을듯 하다.
이제 조금 많이 쓸것같은 img 태그다 말그대로 이미지를 넣고 싶을때 img 태그를 넣고 그안에다가 경로값을 넣어주면 되는데
<img src="이미지 링크/경로" alt"이미지설명"> 이런 느낌이다
저기서 이미지설명 부분은 이미지가 나타나지 않고 에러가 났을때 대비해서 상황대처 문구가 저기에 적은대로 나타날 거라는 것을 의미한다.
다음은 a 태그 앵커 태그다
a 태그를 이용해서 href 속성을 입력해서 하이퍼링크로 다른 페이지로 URL로 연결할때 사용 된다.
href 속성 값 에다가 연결될 URL 링크를 입력 하면된다
눌렀을때 현재창 에서 바로 링크로 연결하게 하려면 _self 을 입력하면 되고 새탭에서 열고 싶으면 _blank를 입력하면 된다.
순서가 없는 리스트 목록을 만들고 싶으면 부모요소로 ul 태그 로 묶어서 자식요소로 li 태그로 만들면 될 듯 하다.
li는 목록의 요소다.
반대로 리스트에 순서가 필요하면 앞에 번호가 붙게 부모요소로 ol 태그 로 묶어서 자식요소로 li 태그로 만들면 될 듯 하다.
인라인요소
인라인요소는 수평 으로 나열된다
높이,너비,그리고 외부와내부 여백 설정이 불가하다
블록 요소 포함 불가.
블럭요소
블럭요소는 강제 줄바꿈 세로로 나열된다
자체적인 크기와 여백을 가진다
일반적으로 타 인라인 요소와 블록 요소를 포함 가능.
input 태그
기본적으로 label 태그로 먼저 어떤 입력 양식의 레이블인지 지정 해주고 input 태그로 본인이 원하는 폼 을 만들면 되는데
(id 고유값, label과 연결)
(autocomplete 자동완성)
(autofocus 페이지로 들어올 때 커서가 위치)
(disabled 수정 불가, 값이 전송되지 않음)
(name 서버로 전송될 항목명)
(readonly 수정 불가, 입력된 값은 전송됨)
이 속성들을 적절하게 함께 이용해야 한다
input 타입은 상황에 맞춰
: 일반 텍스트 입력
: 패스워드 입력 (••• 등으로 표시)
: 전화번호 입력
이렇게 기본적으로 사용 하는듯 하다.
이것을 위에 아까 말한 속성들중 하나 가져와서 상황에 맞게 이용하게 되면 밑에처럼
이렇게 된다
이 외에 textarea와 button 같은 태그 들로도 폼을 나타낼수 있다
이 정도는 각자 금방 알아서 찾아서 원하는 정보를 얻을 수 있을것 같다.
아직 제대로 시작도 안했는데 뭘 자꾸 까먹는 느낌은 무엇인지 😓
