●해당 HTML 관련 글 들은 제가 알아보기 쉽게 메모장 형식으로 쓴 것이며, 실제 내용과 상이할 수 있으며, 제가 알아보기 쉽게 쓴 글로써, 읽으실 때 참고만 하시길 권장드립니다. 대부분의 내용은 생활코딩을 참고하였습니다. 출처를 밝힙니다. 1. 웹 처음 만들 때 순서와 기획 기획을 해야 하는데 "펜슬",이나 "발사믹" 같은 모델링 사이트에서 만들어도 되지만, 유료인 관계로, 가능하면 파워포인트로 만들어도 된다. 2. Interface 말이라는 도구를 통해 사람들은 서로 정보를 주고받고, 무언가 요청을 할 수 있다. 서로 소통하기 위한 기계들의 접점 즉, 컴퓨터나 스마트폰은 전원 버튼이 있는데, 시스템에게 전원을 끄라고 명령할 수 있다. 이러한 것을 인터페이스라고 할 수 있다. 예를 들어= USB, 웹..
●해당 HTML 관련 글 들은 제가 알아보기 쉽게 메모장 형식으로 쓴 것이며, 실제 내용과 상이할 수 있으며, 제가 알아보기 쉽게 쓴 글로써, 읽으실 때 참고만 하시길 권장드립니다. 대부분의 내용은 생활코딩을 참고하였습니다. 출처를 밝힙니다. 1. 표를 만들 수 있다. 2. 테이블 안에 행을 넣을 수 있다. 2-1. 테이블 안에 데이터를 넣을 수 있다. 2-1-1. colspan 열을 늘릴 수 있다. ex) Out of Town 열을 두 칸 늘렸다는 뜻이다. 2-1-2. rowspan 행을 늘릴 수 있다. Out of Town 2는 행을 두 칸 늘릴 수 있다는 뜻이다. 2-2. 테이블 안에 header이다. 표제목을 넣을 수 있다. 2-2-1. scope 행과 열에 대한 정의를 내릴 수 있다. 한 마디로..
●해당 HTML 관련 글 들은 제가 알아보기 쉽게 메모장 형식으로 쓴 것이며, 실제 내용과 상이할 수 있으며, 제가 알아보기 쉽게 쓴 글로써, 읽으실 때 참고만 하시길 권장드립니다. 대부분의 내용은 생활코딩을 참고하였습니다. 출처를 밝힙니다. 머리말이다. 태그 상위에 위치하며, 태그에서 쓰이는 코드들이 따로있다. ex) 웹브라우저의 제목을 넣을 때 필요한 태그이다. 태그 사이에 넣는 태그이다. 앵커 태그라고 불리며, 외부나 내부 페이지, 또는 동일한 페이지의 콘텐츠에 연결(책갈피 역할)하는 데 사용한다. 링크를 설정할 수 있는 태그이다. 혼자서 기능을 수행하지 못하며, 태그와 태그와 함께 사용한다. href : ex) hypertext reference(참조)의 줄임말이다. 링크 주소를 지정하는 하나의 ..
●해당 HTML 관련 글 들은 제가 알아보기 쉽게 메모장 형식으로 쓴 것이며, 실제 내용과 상이할 수 있으며, 제가 알아보기 쉽게 쓴 글로써, 읽으실 때 참고만 하시길 권장드립니다. 대부분의 내용은 생활코딩을 참고하였습니다. 출처를 밝힙니다. HTML로 코딩을 시작할 때 먼저 입력하는 코드로 해당 페이지는 HTML 5.0으로 작성하겠다는 의미로 앞에 명시한다. *HTML 버전별로 사용하는 태그가 다르다. *버전을 명시해서 브라우저가 페이지를 올바르게 표시하기 위해 사용한다. (브라우저에게 버전을 알려주기 위해) 맞지않는 코드를 사용했을 때 브라우저가 알아 먹지 못할 수도 있기 때문이다. 을 작성하고 바로 아래에 쓰이는 코드로 문서 전체를 로 덮어야 한다. 이 역시 브라우저가 이 전체 코드가 HTML 코드..
평소에 이고잉님의 생활코딩을 통해 ATOM 에디터를 쓰다가, 비주얼 스튜디오 코드로 갈아탔다. 이유는... 흠 아직 코린이라 잘 모르지만, 많이들 사용하는 것 같고, 뭔가 더 있어보이는?? 그렇다. 말도 안되는 이유이다. 뭐.. 많이들 쓰는 이유가 있겠지.. 아무튼 쓸데없는 이야기는 나중에 하고, 여러 코드를 작성하면서, 비슷한 단어나 여러 문구를 한 번에 수정하는 법이 있다. 뭐.. 그냥 복붙 여러번하면 안되냐 일 수도 있는데, 특정 부위만을 바꿀 수도 있고, 페이지에서 사용된 모든 코드들을 한 번에 바꿀 수도 있는 능력을 가지고 있다. Ctrl + Shift + L 버튼이다. 일단 수정하려는 단어를 드래그해서 선택하고, 이 버튼을 누르면, 선택한 단어와 같은 모든 단어가 동시에 선택이 된다. 이 때 ..
●해당 HTML 관련 글 들은 제가 알아보기 쉽게 메모장 형식으로 쓴 것이며, 실제 내용과 상이할 수 있으며, 제가 알아보기 쉽게 쓴 글로써, 읽으실 때 참고만 하시길 권장드립니다. 대부분의 내용은 생활코딩을 참고하였습니다. 출처를 밝힙니다. 동영상 태그이다. width height controls Video not supported 등의 속성이 있는데, 하나하나 보면, width는 가로 길이를 의미하고, height는 세로길이를 의미한다. controls는 일시중지와 재생 및 건너뛰기 기능을 추가할 수 있는 속성이다. 비디오나 동영상이 만약 오류가 있어, 비디오 로드를 할 수 없는 경우에 이 문구가 뜨게 만드는 것이다. 아래 식 처럼 와 사이에 입력한다. 예를 들어, Video not supported..
●해당 HTML 관련 글 들은 제가 알아보기 쉽게 메모장 형식으로 쓴 것이며, 실제 내용과 상이 할 수 있으며, 제가 알아보기 쉽게 쓴 글로써, 읽으실 때 참고만 하시길 권장드립니다. 대부분의 내용은 생활코딩을 참고하였습니다. 출처를 밝힙니다. 굵은 글씨체로 중요한 표현을 할 때 사용. 와 나타나는 표현은 같지만, strong은 예를 들어 시각 장애인을 위한 소리 내 읽어주는 프로그램을 만들 때 기능을 추가해 사용하는 등의 응용이 가능하다. 이 차이점이 중요하다. 는 단순한 굵은 글씨체 은 중요한 굵은 글씨체 글자를 기울게 해준다. 줄을 바꿔준다. 예를 들어, 를 사용하면 줄도 두번 내려간다. List Item 이나 사용시 리스트를 만들 때 사용한다. Unordered Lists 순서가 필요하지 않는 리..
●해당 HTML 관련 글 들은 제가 알아보기 쉽게 메모장 형식으로 쓴 것이며, 실제 내용과 상이 할 수 있으며, 제가 알아보기 쉽게 쓴 글로써, 읽으실 때 참고만 하시길 권장드립니다. 대부분의 내용은 생활코딩을 참고하였습니다. 출처를 밝힙니다. 이미지 삽입 시 사용 source를 넣어 사용한다. 예를 들어, 슬래시를 넣든 안넣든 상관은 없다.(스스로 닫는 태그이다) -관련 속성- src Source 이미지의 속성이다. 출처라는 의미이다. 이미지나 링크 삽입시 사용한다. alt 이미지의 속성이다. 이미지의 마우스 커서를 가져다 대었을 때 이미지에 대한 설명이 나오게 하기 위함이다. 적지 않아도 되지만, 1. 웹 접근성 2. 검색 엔진 최적화 3. 오류 발생 시 정보 확인 을 위해서 적는게 좋을 수도 있다...
●해당 HTML 관련 글 들은 제가 알아보기 쉽게 메모장 형식으로 쓴 것이며, 실제 내용과 상이 할 수 있으며, 제가 알아보기 쉽게 쓴 글로써, 읽으실 때 참고만 하시길 권장드립니다. 대부분의 내용은 생활코딩을 참고하였습니다. 출처를 밝힙니다. Bold 굵은 글씨를 적용할 때 사용한다. 과 나타나는 표현은 같지만, strong은 예를 들어 시각 장애인을 위한 소리 내 읽어주는 프로그램을 만들 때 기능을 추가해 사용하는 등의 응용이 가능하다. 이 차이점이 중요하다. 는 단순한 굵은 글씨체 은 중요한 굵은 글씨체
●해당 HTML 관련 글 들은 제가 알아보기 쉽게 메모장 형식으로 쓴 것이며, 실제 내용과 상이 할 수 있으며, 제가 알아보기 쉽게 쓴 글로써, 읽으실 때 참고만 하시길 권장드립니다. 대부분의 내용은 생활코딩을 참고하였습니다. 출처를 밝힙니다. 의미가 잘 드러나는 웹이라는 뜻이다. 시맨틱 HTML은 태그 사이에있는 내용에 대한 컨텍스트를 제공하는 특정 요소를 통해 페이지에 의미를 도입합니다. 시맨틱 HTML은 최신 표준이며 화면 판독기를 사용하여 웹 페이지를 번역하고 웹 사이트의 SEO를 향상시키는 사람들이 웹 사이트에 액세스 할 수 있도록합니다. , , 및 웹 페이지의 기본 구조를 만들 수 있습니다. 장, 제목 또는 테마가 같은 문서의 다른 영역과 같은 문서의 요소를 정의합니다. 기사, 블로그, 댓글 ..
●해당 HTML 관련 글 들은 제가 알아보기 쉽게 메모장 형식으로 쓴 것이며, 실제 내용과 상이 할 수 있으며,제가 알아보기 쉽게 쓴 글로써, 읽으실 때 참고만 하시길 권장드립니다. 대부분의 내용은 생활코딩을 참고하였습니다. 출처를 밝힙니다. Navigational Links Home Posts Contact 위에 디브로 써놓은 태그들을 헤더와 나브로 표현할 수 있다.헤드와 나브로 표시하면 더 쉽게 읽을 수 있다. Navigational Links Home Posts Contact 이런식으로 디브를 헤더와 나브, 메인이나 푸터등 굳이 디브를 사용하지 않아도간소화할수 있다.
●해당 HTML 관련 글 들은 제가 알아보기 쉽게 메모장 형식으로 쓴 것이며, 실제 내용과 상이 할 수 있으며, 제가 알아보기 쉽게 쓴 글로써, 읽으실 때 참고만 하시길 권장드립니다. 대부분의 내용은 생활코딩을 참고하였습니다. 출처를 밝힙니다. World Wide Web Consortium 웹 표준을 개발하는 커뮤니티이다. 웹 표준을 정의했다. 어떤 태그는 필요하지 않고, 어떤 태그는 시대의 요구에 의해서 필요하다 판단하는 국제기구이다. 이 국제기구의 의장은 HTML의 창시자이기도 한 팀 버너스리이다.
●해당 HTML 관련 글 들은 제가 알아보기 쉽게 메모장 형식으로 쓴 것이며, 실제 내용과 상이 할 수 있으며, 제가 알아보기 쉽게 쓴 글로써, 읽으실 때 참고만 하시길 권장드립니다. 대부분의 내용은 생활코딩을 참고하였습니다. 출처를 밝힙니다. 코딩을 새로 시작하기 앞서, HTML의 뜻과 여러가지 의미를 알아보기 위해 작성했습니다. HTML의 의미 HYPER TEXT MARK UP LANGUAGE의 약자이다. 웹 문서를 연결해주는 언어 하이퍼텍스트는 링크와 링크가 연결되어 잇는 문서를 의미하며, 이 수많은 문서를 연결하는 것을 링크라고 하고, 이렇게 무수한 링크들이 여러다발로 연결되어 있는 것을 웹이라고 말한다. 곧, 링크는 HTML의 본질이자, HTML의 본질은 웹의 본질이다. HTML을 추상적으로 보..