본문 바로가기
반응형

Web/HTML6

[HTML] <button>이 <form> 안에 있는 경우 [HTML] 이 안에 있는 경우 이 안에 있는 경우 클릭했을 때 'submit'이 실행된다. See the Pen Untitled by 양파 (@kdorigyj-the-sans) on CodePen. 위와 같이 안에 있는 은 type이 'submit'인 과 동일하다. 은 안에 있을 때 type의 기본값이 'submit'이 된다. 따라서 버튼을 클릭했을 때 'submit'이 발생하지 않게 하기 위해서는 type을 'button'으로 지정해주면 된다. See the Pen Untitled by 양파 (@kdorigyj-the-sans) on CodePen. 2023. 11. 15.
[HTML] 요소 사이의 공백과 해결법 [HTML] 요소 사이의 공백과 해결법 HTML의 요소 중 'inline-block' 태그에는 문제가 있다. 요소 사이에 공백이 발생한다는 것이다. See the Pen Untitled by 양파 (@kdorigyj-the-sans) on CodePen. 코드의 문법에 따라 다른 결과가 나타난다. 'span1'과 'span2'는 붙어 있는 반면에 'span3'와 'span4' 사이에는 공백이 있다. 공백이 나타나는 현상은 태그뿐만 아니라 , 등에서도 나타난다. 요소 사이에 공백이 발생하는 현상은 CSS로 요소들의 속성을 선언할 때에 어려움을 줄 수 있다. 위 코드의 첫 번째 줄처럼 한 줄에 태그를 이어 붙이면 공백을 없앨 수 있지만 가독성이 떨어진다. 이 문제를 해결할 수 있는 방법은 다음과 같다. 한 .. 2023. 11. 6.
[HTML] 특수문자 엔티티(Entity)와 예약어(Reserved Word) [HTML] 엔티티와 예약어 예약어 (Reserved Word) 프로그래밍 언어에서 문법적인 용도로서 사용되도록 미리 정해진 언어이다. HTML에서는 대표적으로 ''가 있다. "문단을 나누는 태그"를 입력하기 위해 아래와 같은 HTML코드를 만들었다. 문단을 나누는 태그 하지만 결과물은 다음과 같다. 문장 안에 있는 ''를 웹 브라우저는 태그로 인식했다. ''는 HTML 내에서 태그를 나타내는 것으로 약속되어 있기 때문이다. 예약어를 사용하면 웹 브라우저는 우리의 의도와는 다르게 해석할 수 있다. 엔티티 (Entity) HTML 예약어를 HTML에서 적용되는 의미가 아니라 기존에 있던 문자 그대로를 표현하기 위해 있는 것이 엔티티이다. 엔티티 코드의 형태는 "&엔티티이름;", "&#엔티티숫자;" 두 가지.. 2023. 11. 1.
[HTML] HTML5와 <!DOCTYPE> 선언의 이유 [HTML] HTML5와 선언의 이유 HTML5 일반적으로 "HTML의 최신 표준"이라고 말한다. 왜 "최신 언어"가 아니라 "최신 표준"이라 말하는지 그 이유는 다음과 같다. ● HTML5는 HTML언어뿐만 아니라 기술을 포함한다. HTML5는 이전 버전에 대해 새로운 요소, 속성 등이 추가되었고 더 정리된 문법을 가지게 되었다. 그런데 HTML 내의 기능적 측면 말고도 HTML의 동작에 대한 부분이 개선되었다. CSS와 JS과의 상호작용, 브라우저의 호환성, 비디오와 그래픽 처리 등의 관련 기술들을 가지게 되었다. 한마디로, 기존에 HTML만으로 불가능했던 것들이 HTML5를 통해서 가능하게 되었다. HTML5를 "언어"라고 한다면 그것이 틀린 말은 아니라고 생각한다. 하지만 "언어"라는 단어는 HT.. 2023. 10. 31.
[HTML] 기본 구조 [HTML] 기본 구조 모든 HTML 문서가 가지는 기본적인 표준화된 구조는 다음과 같다. 문서(document)의 타입(type)을 명시하는 선언문이다. DOCTYPE은 HTML 문서에서 최상단에 위치하여 가장 먼저 선언되어야 된다. HTML의 최신 규격, HTML5 버전을 사용하고 있음을 브라우저에 알리는 것이다. 브라우저가 표준 방식으로 처리하게 해주고 버전에 따라 호환되는 태그도 다르기 때문에 반드시 선언해준다. (만약 안하면 내가 생각한 것과 다르게 브라우저가 자기 멋대로 해석할 수도 있다.) HTML 문서의 최상위 요소이다. 하나의 데이터를 설명하는 데이터인 메타데이터(metadate) 요소이다. 태그에서 정의된 메타데이터는 브라우저나 다른 웹에서 사용하게 된다. 페이지 상에 보이지 않는 내용.. 2023. 10. 30.
[HTML] 파일 열기 [HTML] 파일 열기 확장자가 ".html"인 파일 여는 법 목적에 따라 두 가지로 나눈다. 1. 편집 2. 결과물 확인 1. 편집 웬만하면 에디터를 이용한다. 나는 VS Code를 사용한다. 메모장에서도 편집이 가능하다. 2. 결과물 확인 웹 브라우저를 이용한다. 아무 브라우저나 쓰면 된다고 하지만 대부분 크롬을 추천하니까 나도 크롬 사용한다. html 파일에 " 우클릭 >> 연결 프로그램 "에서 웹 브라우저를 선택한다. 아니면 웹 브라우저를 켜놓고 파일을 드래그로 끌어 놓으면 된다. 2023. 10. 30.
반응형