어제 오늘 내일

HTML에서 기울임체 (이탤릭체, italic) 표현하기 HTML 태그를 이용하여 이탤릭체를 표현하는 방법은 두 가지가 있다. 태그와 태그 태그 See the Pen html example by anna (@hianna) on CodePen. 태그는 italic이라는 글자의 약자이다. 태그 사이에 이탤릭체로 표현하고자 하는 내용을 삽입하면 된다. 태그 See the Pen html example by anna (@hianna) on CodePen. 태그는 emphasize의 약자로, 강조한다는 뜻이다.태그와 마찬가지로태그 사이에 이탤릭체로 표현하고자 하는 내용을 삽입하면 된다. 그렇다면, 이탤릭체 하나를 표현하는 왜 이렇게 두 가지 태그가 따로 존재하는지 알아보자. 태그와 태그의 차이점 See the P..

HTML에서 위첨자, 아래첨자 표현하기 위첨자란 보통크기의 글씨 위에 작게 쓴 글씨를 말한다.아래첨자란 보통크기의 글씨 아래에 작게 쓴 글씨를 말한다. 주로 수학식이나 화학기호를 표현하거나,단락에서 주석을 표시할 때 많이 쓰이는 방식이다. HTML에서 이러한 위첨자, 아래첨자를 표현하는 방법을 알아보자. HTML에서 위첨자 표현하기 See the Pen html example by anna (@hianna) on CodePen.는 '위첨자', '위에 쓴'이라는 뜻의 영어 단어 'superscript'의 약자이다.위와 같이 위첨자로 표시하려는 글자를 태그로 감싸주면 된다. HTML에서 아래첨자 표현하기 See the Pen html example by anna (@hianna) on CodePen.는 '아..

HTML에서 굵은 글씨(bold, 볼드체) 표현하기 HTML에서 굵은 글씨, bold 체를 표현하는 방법은 두 가지가 있다. 태그 See the Pen bold by anna (@hianna) on CodePen. 태그 사이에 굵은 글씨로 표현하고자 하는 내용을 삽입하면 된다. 태그 See the Pen bold by anna (@hianna) on CodePen. 태그와 마찬가지로 태그 사이에 굵은 글씨로 표현하고자 하는 내용을 삽입하면 된다. 태그와 태그의 차이점 그렇다면 태그와 태그를 구분하여 사용하는 이유는 무엇일까? 태그는 html의 스타일을 정의하는 태그이다.단순히 화면에 보여지는 모양을 정의한다. 태그는 html의 의미를 정의하는 태그이다.겉으로 보기에는 태그와 다를바 없이 굵은 글씨를 표현..

HTML에서 링크(link) 걸기 인터넷에서 텍스트나 이미지를 클릭했을 때다른 페이지로 이동하는 기능을 구현하는 방법을 알아보도록 하겠다.See the Pen 하이퍼링크 by anna (@hianna) on CodePen. 이 하이퍼링크 기능을 구현하기 위해서는위와 같이 태그와 그 안의 속성들을 사용한다. 는 'anchor', 즉, '닻'이라는 뜻이다.우리는 보통 인터넷 서핑, 웹서핑 이라는 말을 많이 쓴다.인터넷, 정보의 바다를 항해한다고도 표현한다.인터넷에서 정보의 바다를 항해하는 것은 대부분 링크를 클릭함으로써 이루어진다.그런 의미에서 html에서 링크를 표현하기 위해서 'anchor'의 약자인 태그를 사용한다.항해를 하기 위한 닻. href링크를 클릭했을 때 이동할 페이지를 href 속성에 표현한..

[파이썬 / python]'UnicodeDecodeError: 'cp949' codec can't decode bytes in position~~ ' 오류 해결 하기 파이썬으로 한글 파일을 읽어오다가 아래와 같은 오류가 발생하였다.UnicodeDecodeError: 'cp949' codec can't decode bytes in position ~~~ 원인을 찾아보니 읽으려는 파일이 UTF-8 형식이기 때문!해결하기 위해서는 파일을 읽을 때 인코딩 형식을 지정해 주어야 한다. 파일을 읽을 때 인코딩, 디코딩 방법을 지정해주기 위해서는codecs 모듈을 이용해야 한다.아래의 document를 참조하였다.https://docs.python.org/3/library/codecs.html#module-codec..

지난번에는 HTML에서 순서없는 목록을 만드는 방법을 알아보았다.[HTML] 순서없는 목록 만들기, 이번에는 순서있는 목록, 즉, 목록 앞에 의미없는 기호대신 순서를 나타낼 수 있는숫자나 알파벳을 붙여서 나타내는 방법을 알아보도록 하겠다. 순서있는 목록 만들기, 순서있는 목록을 만들기 위해서는 두 가지 태그를 사용해야 한다. 은 'Ordered List'의 약자이고,는 'List'의 약자이다. 순서없는 목록을 만드는 것과 마찬가지로 태그 안에는 목록을 만들 각각의 항목들을 작성하고,이 태그들을 태그로 감싸면 아래와 같이 숫자 목록이 만들어진다.See the Pen 리스트6 by anna (@hianna) on CodePen. 목록 순번 기준 변경하기이번에는 목록의 순번을 숫자 이외의 방법으로 나타내는 방..

이번에는 HTML에 순서없는 목록을 표현하는 방법을 알아보도록 하겠다. 순서없는 목록 만들기, 태그html에서 목록을 만들기 위해서는 두 가지 태그를 사용해야 한다. 은 'Unordered List'의 약자이고,은 'List'의 약자이다. 태그 안에는 목록을 만들 각각의 항목들을 작성하고,이 태그들을 태그로 감싸면 목록이 만들어진다. See the Pen 리스트1 by anna (@hianna) on CodePen. 각각의 항목들은 위와 같이 항목 앞에 항목을 구분하는 기호가 나타난다. 목록 기호 변경하기이번에는 이 기호들을 변경하는 방법을 알아보도록 하자. 목록 기호를 변경하기 위해서는 css의 'list-style-type' 속성을 지정해주면 된다.list-style-type 속성에 들어 갈 수 있는..

테이블의 제목을 지정하기 위해서 HTML에서는 이라는 태그를 사용한다. 이번에는 이 태그를 사용하는 방법을 알아보도록 하겠다. 태그는 테이블의 제목을 표현하기 위해 사용한다. See the Pen 테이블2 by anna (@hianna) on CodePen. 위와 같이 태그는 태그 안에서 사용되며, 테이블의 제목을 표현한다. 아무런 속성을 지정하지 않고 태그를 사용할 경우, 테이블의 caption 정보는 테이블의 위쪽에, 가운데 정렬되어 표현된다. caption의 위치를 옮기고 싶다면? 1. 태그 안에 align 속성을 지정하는 것이다. 하지만 비추! See the Pen 테이블3 by anna (@hianna) on CodePen. 위의 예제에서는 caption이 오른쪽으로 정렬되도록 지정하였다. 이와..

HTML에서 웹페이지에 테이블(표) 형태를 표현하기 위해서주로 태그를 사용한다.이번에는 이 table 태그와 관련된 태그와 속성을 이용해서 웹페이지에 table을 표현하는 방법을 알아보도록 하겠다. table 그리기 - 기본table을 표현하기 위해서는 가장 기본적으로 , , , 이렇게 네 가지 태그를 사용한다. 먼저 예제를 살펴보자.See the Pen 테이블1 by anna (@hianna) on CodePen. 기본적으로 테이블은 행과 열이 존재한다.그리고, 행 또는 열에 대해서 제목을 붙여주기도 한다. 위의 예와 같이html에서 표를 그리기 위해서는 태그 사이에행과 열, 제목을 표현해 주는 , , 태그를 사용하고,그 사이에 표에 넣어주고자 하는 내용을 적어주면 된다. tr은 'table row'의..

HTML 파일의 코드가 길어지면 도대체 이 코드들이 무슨 말을 하는 건지 알아보기가 힘들다.그래서, HTML은 브라우저가 알아보는 언어이지, 인간이 쉽게 알아보기 위한 언어는 아니기 때문이다.그래서, HTML 문서 안에 인간이 알아보기 위한 언어를 추가 할 수 있다.당연히 이 언어는 브라우저는 알아보지 못해야 하고, 웹 브라우저에 표시 되어서도 안된다.이를 보통 '주석을 단다'고 한다. HTML 주석(Comment) 달기 HTML 내에서는 '' 태그 사이에 주석을 삽입할 수 있다. 이 태그 사이의 말들을 브라우저는 해석하지 않는다. 아래는 웹 브라우저에서 html 파일을 작성하고, 바로바로 확인 할 수 있는 도구이다.아래 코드에서 주석을 삭제하면 어떻게 되는지 확인해 보자. See the Pen 주석2 ..