일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 |
- Visual Studio Code
- table
- 자바
- CMD
- date
- input
- 이탈리아
- Java
- 자바스크립트
- 배열
- 이클립스
- html
- js
- Maven
- string
- ArrayList
- Eclipse
- vscode
- Files
- 테이블
- 문자열
- json
- Button
- 인텔리제이
- windows
- javascript
- Array
- IntelliJ
- CSS
- list
- Today
- Total
목록IT/HTML&CSS (104)
어제 오늘 내일
테이블의 제목을 지정하기 위해서 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 ..
HTML5의 큰 특징 중 하나는 시맨틱(Semantic) 태그이다. 시맨틱(Semantic) 태그란? 시맨틱(Semantic)은 "의미의, 의미론적인"이라는 뜻이다. 즉, HTML5에 도입된 시맨틱 태그는 개발자와 브라우저에게 의미있는 태그를 제공하게 된다. 예를 들어, 태그는 non-semantic 태그라고 할 수 있고, , 등의 태그는 semantic 태그라고 볼 수 있다. 일반적으로 태그만 보고는 이 태그 안에 들어간 내용의 의미를 알 수가 없다. 반면, , 등의 태그는 대략이라도 태그 안에 들어갈 내용의 의미를 유추할 수 있다. 태그 안에는 표가 들어갈 것이고, 태그 안에는 어떤 형태의 글이든 글이 들어갈 것이라는 것 정도는 유추 할수 있다. 좀 더 자세히 살펴보면, 이전의 html에서 heade..