목록Web (46)
Minwoo Dev.
오늘은 100문100답에 해당하는 페이지인 100answers.html 파일을 수정하였다. 사진파일을 옮기지 못해서 travel.html 파일은 다음번에 수정하기로 하였다. 100answers.html 소스코드 About Minwoo Name Contacts School 100Answers Travel 100 Questions & 100 Answers 당신은 왜 100문 100답을 시작했나? 나를 나타내는 여러가지 방법들 중 하나라서 100문 100답을 하기로 함. 이름(한글/한자/영어) 이 민 우 LEE MIN WOO 李旼宇 성별 남자 생년월일 2002.11.19 혈액형 RH+ B 키, 몸무게 177cm, 71kg 발 사이즈 275mm 시력 r : -8, l : -7.5 별명 뚜굴이 내 장점 꼼꼼함, ..
카테고리별로 html 파일을 나누어서 클릭 시 넘어가도록 하였다. 오늘은 카테고리별로 HTML 파일을 나누고, name.html, contact.html, school.html 을 정리하였다. 1. Name 에 name.html 로 연결되는 하이퍼링크를 걸어뒀다. 실행하고 1. Name 을 클릭해야 name.html 파일의 실행 결과를 볼 수 있다. 각 코드는 잘린 부분도 있으므로 첨부하겠다. name.html About Me Name Contacts School 100Answers Travel MY NAME 나의 이름은 이민우 이고, 영어로는 LEE MIN WOO, 한자로는 李旼宇 이다. 결과 HTML 삽입 미리보기할 수 없는 소스 contact.html About Me Name Contacts Sch..
이때까지 학습한 HTML 내용을 가지고 나를 소개하는 HTML 문서를 만들어보려고 한다. 구상한 웹페이지의 대략적인 모습은 아래와 같다. About Minwoo 카테고리 - 이름 - 학교 - 100문 100답 - 버킷리스트 - 여행 나에 대한 기본적인 정보들 위와 같은 형식으로 구상하였고, 카테고리의 항목들을 클릭하면 내용을 보여주는 형식으로 만들 것이다. 각 카테고리별 세부 작성사항으로는 이름 한글, 영문, 한자 모두 표시하며 한자 뜻도 표시하면 좋을듯함. ( 한자에 커서 올릴 때 표시된다면 더욱 좋을 거 같음. ) 학교 초 중 고 대 순으로 학교를 기입하고 간단한 학교 설명 + 사진 한 장. ( 학교 이름에 각 공식 페이지 하이퍼링크 걸기. ) 100문 100답 인스타그램 스토리로 많이 올렸던 100..
태그는 HTML 문서에서 링크를 첨부할 때 사용하는 태그이다. 자세한 정보는 아래와 같다. 정의 및 사용법 태그 는 한 페이지에서 다른 페이지로 연결하는 데 사용되는 하이퍼링크를 정의합니다. 요소의 가장 중요한 속성은 링크의 대상을 나타내는 속성인 href 입니다. 기본적으로 링크는 모든 브라우저에서 다음과 같이 표시됩니다. 방문하지 않은 링크는 밑줄과 파란색으로 표시됩니다. 방문한 링크는 밑줄과 보라색으로 표시됩니다. 활성된 링크는 밑줄과 빨간색으로 표시됩니다. 팁 및 참고사항 팁 : 태그에 href 속성이 없으면 하이퍼링크의 자리 표시자일 뿐입니다. 팁 : 다른 대상을 지정하지 않는 한 연결된 페이지는 일반적으로 현재 브라우저 창에 표시됩니다. 도움말 : CSS를 사용하여 링크 스타일 지정하기 : C..
이제 자주 사용되는 태그들을 여러 개 알아봤으니 기본적인 HTML 문서의 구조에 대해서 알아보자. 우선, 우리가 문서를 작성할 때, 그 문서 자체의 제목은 파일명으로만 저장해두는 경우가 많은데, HTML 에서는 태그로 HTML 문서의 제목을 설정한다. Definition and Usage (ENG) The tag defines the title of the document. The title must be text-only, and it is shown in the browser's title bar or in the page's tab. The tag is required in HTML documents! The contents of a page title is very important for sea..
글을 쓸 때, 목차를 나타내려면 아래의 왼쪽과 같은 모습으로 작성할 것이다. 하지만 HTML 에서는 저렇게 코드를 작성한다면 원하는대로 결과가 나오지 않는다. 오른쪽 화면에서 줄을 띄워줘야 하니까 태그를 사용해보자. 원하는대로 줄을 띄웠다. 이렇게 한다면 정말 좋겠지만 HTML에는 목록을 나타내는 태그가 따로 있다. 태그는 list의 약자로, 목록을 만드는 태그입니다. 이 태그는 단독으로 쓰이지 않으며 또는 태그 내부에 들어갑니다. 태그는 번호를 메겨 순서가 있는 (Ordered List) 목록을 만듭니다. 태그는 순서없이 모양으로 (Unordered List) 목록을 만듭니다. 태그는 단순히 리스트 나열 뿐만 아니라 메뉴 등을 만들때도 사용합니다. 이중리스트를 만들기 위해서는 이나 하위에 다시 이나 태..
태그는 이미지를 삽입하는 태그로, src 속성을 통해 이미지 경로를 지정합니다. 이미지 파일이 src 속성에서 지정한 경로에 없을 시, 이미지는 출력되지 않거나 엑스박스가 뜨게 됩니다. 속성 src : 이미지의 경로 width : 이미지 가로 크기 height : 이미지 세로 크기 출처 - https://ofcourse.kr/html-course/img-%ED%83%9C%EA%B7%B8 HTML 태그 - ofcourse 개요 태그는 이미지를 삽입하는 태그로, src 속성을 통해 이미지 경로를 지정합니다. 이미지 파일이 src 속성에서 지정한 경로에 없을시, 이미지는 출력되지 않거나 엑스박스가 뜨게 됩니다. 속성 ofcourse.kr HTML에서 이미지를 첨부할 때 사용하는 태그가 태그이다. 라고만 작성한..
블로그나 메일에서 글을 쓸 때, 글의 제목을 표시할 때 어떻게 설정하는가 ? 위와 같은 에디터가 있다고 했을 때 제목을 설정하는 방법은 두가지가 있을 것이다. 글자 크기를 키우고, 볼드체로 바꾸는 방법. 그리고 포맷이라는 기능으로 설정하는 방법. 이 두 방법의 차이는 HTML 코드를 보면 확실하게 나타난다. coding 첫번째 경우에서는 글자를 굵게 한 태그와 폰트 사이즈를 바꾼 font-size:22px 등의 내용이 복잡하게 나타났다. coding 반면, 포맷을 이용한 방법은 태그 하나로 간결하게 나타난 걸 볼 수 있다. 이러한 차이는 별 거 없어 보이더라도 웹사이트에서 검색을 하였을 때 확연하게 나타난다. 제목을 인식하여 결과를 내보내는 포탈 사이트에서는 '제목'으로 확실하게 명시한 방법이 검색 결과..
HTML 에서 줄바꿈을 나타내려면 어떤 태그를 사용해야 하는지 검색 사이트를 통해 검색해보았다. 이 중 첫번째 사이트에 접속하여 결과를 보니 태그에 대하여 적혀있었다. Definition and Useage The tag inserts a single line break. The tag is useful for writing addresses or poems. The tag is an empty tag which means that it has no end tag. 즉, 태그는 하나의 줄바꿈을 실행하는 태그이며, 연락처나 시를 작성할 때 유용하고, end tag()를 작성하지 않는다. Tips and Notes Use The tag to enter line breaks, not to add space b..
태그는 굵은 볼드체 글씨를 표현할 때 사용한다. "이민우" 라는 이름은 영문으로 Lee Min Woo 이며, 한자로는 李旼宇 로 표기한다. 결과 HTML 삽입 미리보기할 수 없는 소스 ~ 태그는 heading(제목)을 나타내는 태그! https://developer.mozilla.org/ko/docs/Web/HTML/Element/Heading_Elements –: HTML 구획 제목 요소 - HTML: Hypertext Markup Language | MDN HTML – 요소는 6단계의 구획 제목을 나타냅니다. 구획 단계는 이 가장 높고 은 가장 낮습니다. developer.mozilla.org ~ 태그는 heading(제목)을 나타내는 태그! * 태그 다음에는 태그가 와야함. 순차적으로 태그를 사용하..