본문 바로가기

HTML4

시멘틱 마크업 시멘틱은 의미론적이란 뜻이다. 즉, 시멘틱 마크업이란 의미론적인 마크업이라는 말이다. 브라우저(컴퓨터)가 잘 이해할 수 있는 코드라는 뜻이다. 의미에 맞는 요소를 사용하고 문서의 구조화를 잘 하여 인간과 기계가 모두 이해할 수 있는 코드를 짜야한다는 것이다. 1. 의미에 맞는 태그 사용 아래는 화면으로 보기엔 같은 모습으로 표현되나 단순 표현용 태그와 의미를 가지는 태그로 차이가 있는 몇가지 태그들이다. 굵은 vs 중요한 밑줄친 vs 새롭게 추가된 중간선이 있는 vs 삭제된 예를 들어 태그와 태그는 보기엔 굵은 글자로 같은 효과를 주는 것처럼 보이지만, 태그는 그저 굵은 글씨를 만들어주는 태그이고, 태그는 중요한 글자를 나타내는 태그이다. 태그도 보기엔 그저 태그처럼 굵은 글자로 표현되지만, 브라우저에서.. 2020. 7. 20.
HTML 문서의 기본 구조 - DOCTYPE과 <html> 요소 head 태그와 meta 태그에 들어갈 것들까지... HTML의 기본적인 구조는 다음과 같다. Hello, HTML 크게 문서 타입 정의와 요소로 구분한다. 1. 문서 타입 정의 문서 타입 정의는 DTD(doctype)라고 부른다. 위 코드에서 가장 상단에 있는 를 가리킨다. (은 대소문자 상관이 없다.) 이처럼 문서 타입 정의는 최상단에 선언되어야 한다. 문서가 어떤 버전으로 작성되었는지를 브라우저에게 알려주는 선언문이기 때문이다. 예시 코드의 은 이 문서가 HTML5로 작성되었다고 알려주는 것이다. DOCTYPE을 선언하지 않거나 잘못 선언하면 브라우저는 이 문서를 비표준 방식으로 해석해버린다고 한다. HTML 버전별 DOCTYPE 선언문이다. - HTML 5 - HTML 4.01 Strict 같은 .. 2020. 2. 23.
코드에 메모하는 법 - 주석(Comment) 주석은 코드 내에 작성하는 메모라고 생각하면 된다. 주석 처리된 부분은 프로그램이 해석하지 않는다. 사용자와 프로그램에겐 노출되지 않는 부분, 즉, 개발자들을 위한 장치인 것이다. 프로그램이 클 수록 코드를 알아보기가 어려워진다. 특히 협업하는 경우, 주석으로 다른 개발자들을 도와줄 수 있다. 다른 개발자뿐만 아니라, 자신에게도 마찬가지다. 예를 들어, 테스트 코드나 임시로 작성된 코드가 있을 때, 이걸 주석으로 알려주면 좀 더 빠르게 코드를 이해할 수 있을 것이다. 프로그래밍 언어마다 주석 처리하는 방법이 조금씩 다르다. 아래로 HTML, CSS, JavaScript, Java의 주석 처리 방법에 대해 정리하였다. 1. HTML 1) HTML은 다음과 같이 주석을 처리한다. 로 닫는다. 이 사이에 들어.. 2020. 1. 2.
파일 업로드 & 다운로드 파일을 업로드하고 다운로드하는 방법에 대해 알아보려고 한다. 1. 파일 업로드 1) HTML 파일 업로드는 form 데이터로 쉽게 업로드할 수 있다. HTML 태그를 다음과 같이 작성한다. 파일도 이렇게 input 태그로 데이터를 전송할 수 있다. (type은 file이다.) name으로 이름을 지정하면, 서버에선 이 이름으로 데이터를 얻을 것이다. accept는 전송 허용 가능한 파일의 타입을 지정하는 것이다. 예제 코드에서는 모든 이미지 파일을 허용하고 있다. 이런 식으로 이미지 파일 중 png, jpeg 확장자의 파일만 허용하겠다고 할 수도 있다. 콤마로 여러 타입을 지정할 수 있다. 참고로 accept 속성의 브라우저 지원 범위는 별로 좋지 않다. Can I use 사이트에서 더 자세한 내용을 확.. 2019. 9. 13.