본문 바로가기

전체 글63

앵커 태그 anchor <a> 를 이용해 링크달기 앵커 태그는 anchor 첫 글자를 가져와 만든 태그입니다. 웹이라는 정보의 바다에 닻을 내리고 정박해 있는 모습을 연상할 수 있습니다. html 언어에서는 링크를 연결하는 역할을 하는 태그입니다. 태그를 이용하여 링크를 걸기 위해서는, 우선 링크를 연결하고 싶은 곳을 태그로 감싸줍니다. 그리고 코드에 속성을 추가해줍니다. 2020. 8. 22.
웹 페이지의 기본 구조와 인코딩 위한 utf 8 태그를 이용하여 웹 페이지의 제목을 수정할 수 있습니다. 웹 페이지의 제목은 책의 표지와도 같은 역할을 합니다. 제목을 변경하면 정보를 찾는 사용자들에게 본 웹 페이지가 어떤 내용을 담고 있는지 잘 전달할 수 있습니다. 그뿐만 아니라, 검색엔진이 쉽게 여러분의 웹 페이지를 찾을 수 있도록 도울 수 있습니다. 태그는 본문의 제목이 무엇인지 나타내는 태그들을 포함합니다. 태그는 본문의 제목이 무엇인지 나타냅니다. 태그 아래 태그가 삽입되어 있습니다. 이때, charset는 문자를 의미하는 charcter의 char와 규칙을 의미하는 set을 합친 것입니다. 즉 = 이하의 규칙으로 문서를 읽으라고 명령하는 것과 같습니다. 즉, 본문의 문자가 어떤 방식으로 저장되어 있는지 설명하는 태그입니다. 세계 각국에는 다.. 2020. 8. 22.
li 태그, ul 태그, ol태그로 순서대로 목차 만들기 태그로 목차 만들기 목록을 의미하는 List에서 앞 두 글자 Li를 따와서 리스트 태그를 사용할 수 있습니다. 1.OrderA 2.OrderB 3.OrderC 위와 같이 텍스트를 작성해보았습니다. 이 상태에서 Ctrl 키를 누릅니다. 그리고 커서를 1, 2, 3등 숫자 앞에 차례대로 두고 마우스 왼쪽 버튼을 클릭합니다. 이렇게 하면 동시에 여러 개의 태그를 편집할 수 있도록 영역이 지정됩니다. 매우 편리한 기능이므로 잘 기억해두면 좋습니다. 이렇게 지정된 상태에서 태그를 입력해줍니다. 로 태그를 종결할 때도 과정은 동일합니다. Ctrl 키를 누르고 A, B, C뒤에 마우스 커서를 이동하여 영역을 지정한 후에 마무리를 합니다. 1. OrderA 2. OrderB 3. OrderC 태그로 목차 덩어리 만들기.. 2020. 8. 22.
공통문자 엔티티와 이미지 img 태그 공통문자 엔티티 Common character entities의 의미 html에서는 태그를 표현할 때 쓰기로 예약된 문자들이 있으며, 이 문자를 텍스트로써 사용하기 위해서는 변환이 필요합니다. 동일한 결괏값으로 인출되는 문자이지만, html 코딩 작성 화면에서는 태그 표현용 입력방법과 텍스트 표현용 입력방법에 차이가 있습니다. 태그 표현용으로 사용하기로 우선 예약이 되어 있기 때문에, 태그 표현용으로는 그냥 그 기호대로 사용하면 됩니다. 그러나 텍스트로 표현하기 위해서는 해당 기호를 약속된 다른 표현 기호로 변환해주어야 합니다. 자주 사용되는 문자들은 다음과 같습니다. &는 &와 amp;를 이어서 &로 입력할 경우 문자로 표현됩니다. ampersand ~와 함께 한다는 의미를 갖고 있으며, entitie.. 2020. 8. 22.
css로 html 코드를 더욱 심플하게 만들자 CSS언어의 문법을 활용하여 태그와 태그 사이에 여백(margin)을 적용할 수 있습니다. css언어를 html 태그 사이에 삽입할 수 있습니다. HTML means that Hypertext Markup Language. We can learn about HTML with a lot of infromation on the internet HTML과 CSS의 효과적 사용 html언어로 본문을 작성하고 css언어로 시각적인 효과를 높일 수 있습니다. 웹 페이지에 작성하는 text는 검색엔진이 찾고 수집하는 활동에 적합하도록 작성해야 합니다. 검색엔진이 제목을 쉽게 인식할 수 있도록 도움을 주어야 합니다. 코드 등 서식이 적용되어 css의 기능을 대체할 수 있다면, 그 태그를 적극 활용하는 것이 좋습니다. .. 2020. 8. 22.
html 입문 코딩 프로그램 아톰 Atom html editor 에디터 준비와 텍스트 관련 tag 일부 html - Hypertext Makeup Language 입문을 위한 준비와 html editor 그리고 기본 tag 일부 유튜브 등 영상기반 네트워크 플랫폼의 발달로 누구나 쉽게 공부할 수 있는 세상입니다. "생활코딩"님은 쉽고 편한 강의로 코딩 입문자분들에게 엄청난 도움을 주고 계십니다. 저 역시 이분의 유튜브 강의 영상을 참고하여 직접 실습해보겠습니다. 웹 브라우저 또는 유튜브에 "생활코딩"을 검색해보세요. html editor html을 배우기 위한 필수 도구로서 html editor를 준비합니다. 저는 많은 분이 추천하는 Atom으로 선택했습니다. 우선 Atom을 실행합니다. Atom으로 작업에 들어가기 전에 setting을 일부 수정하겠습니다. 왼쪽 위 끝의 File 메뉴 중 setting을.. 2020. 8. 21.
지금이라도 코딩을 시작해야 합니다. 정보처리기사, 정보처리기능사 아니라도 컴퓨터공학 전공이 아니라도 코딩을 모르는 사람은 없습니다. 로봇, 드론, 블록체인, 사물인터넷, 웹디자인 등 산업의 미래가 빠르게 변하고 있습니다. 관련 자격증 리스트만도 엄청납니다. 그러나 대부분의 사람들은 프로그래밍 관련 지식을 전혀 갖추고 있지 않습니다. 저 역시 마찬가지입니다. 저는 코딩을 배우기로 결심했습니다. 누가 시킨 것은 아닙니다. 코딩을 하지 못한다고 해서 당장 제 형편이 더 어려워질 것도 없습니다. 제가 코딩을 시작하기로 마음먹은 이유는 이것 때문입니다. 그 이유는 '지금이라도 당장 시작해야 할 것 같다.'는 조바심입니다. 대다수 산업의 근간이 오프라인에서 온라인으로 옮겨가는 모습을 수년간 지켜만 보고 있었습니다. 하지만 2020년, 현재 시점의 세.. 2020. 8. 20.