HTML/CSS

[HTML] block 요소 overflow

by

block 요소란? 독립된 행을 가지는 요소 집합 크기 지정, 위치 조정 가능 p, h1~h6, ul, ol, li, div, tabel 등 다른 블록 레벨 요소와 인라인 요소 포함이 가능합니다. p, h, dt, address와 같은 일부 요소는 다른 블럭 요소 포함이 불가능합니다. 특정 블럭 레벨 요소의 default width(기본 넓이) 는 100%이며, 실제 값은 auto입니다. default height : … Read more

HTML5 추가 input 요소 – 날짜 관련 input type

by

html5에서는 추가된 input 요소들이 있습니다. 시멘틱 웹을 지향하며 장치들이 보다 더 확실하게 개발자/사용자의 의미를 인식하도록 추가된 요소들입니다. 예를 들어, 카카오톡 대화창에서 특정 날짜를 이야하기면 자동으로 일정 생성이 가능하게 된 것을 비슷한 흐름이라고 할 수 있겠습니다. Contents1 datetime2 week3 month4 date5 time datetime week month date time

HTML viewport 코드의 역할

by

HTML viewport 코드의 역할을 알아보겠습니다. viewport 코드는 html 필수 코드중 하나입니다. viewport 코드는 장치 특성에 맞게 화면의 기본 크기를 조절하는 코드입니다. 따라서 해당 코드가 없거나, 임의로 주석 처리시 반응형 웹을 만들 수 없으며, 모바일에서 웹 사이트를 알맞은 크기로 볼 수 없습니다.

호스팅 웹페이지 루트 폴더 확인

by
호스팅 웹페이지 루트 폴더 확인

대부분의 페이지의 루트 폴더(root folder)는 html 폴더입니다. 물론 vps상에 설치한 워드프레스의 경우에는 조금 다를 수 있지만 닷홈 등 대부분의 호스팅에서 root폴더는 html폴더를 의미합니다. 닷홈의 경우, 아이디.dothome.co.kr를 도메인에 입력해 접속하였을 때 위와 같은 화면이 보입니다. 해당 파일이 FTP html폴더 내 setup-finish.html입니다. 이 곳에 html파일을 업로드해서 도메인 뒤로 확인하고 싶은 경우, 반드시 아이디.dothome.co.kr/파일명.확장자 까지 입력해 주어야 웹 … Read more

HTML form태그와 input 속성 사용방법

by
HTML form태그와 input 속성 사용방법

HTML form태그 form태그 필수 요소 form태그의 모든 양식은 <form> </form> 안에서 작성됩니다. 폼 name과 action, method가 필수 요소입니다. <form> 태그 안에 쓰이는 모든 양식은 name and id를 입력해야 합니다. action은 서버에 해당 데이터를 전송할 스크립트 파일을 지정합니다. method는 GET이나 POST를 이용해 저장합니다. GET은 url주소에 폼 데이터를 붙여서 보내는 방식이며, POST는 url주소에 폼 데이터가 보이지 않습니다. … Read more

css float 속성 사용하기(안될 때 범위 지정, 오류 해결 방법 2가지)

by
css float 속성 사용하기(안될 때 범위 지정, 오류 해결 방법 2가지)

css 속성 중, 블럭 요소들로 가로형 컨텐츠 레이아웃을 만들 때 많이 사용하는 속성인 float의 정의와 사용 방법에 대한 포스팅입니다. Contents1 css float 속성이란?2 css float 속성 적용 방법2.1 1. 부모 태그 지정2.2 2. float 속성 css 파일에 추가2.3 3. 오류 확인3 css float 속성 범위 설정이 제대로 안될 때(float 오류 해결)3.1 clear 속성 부여 방법3.1.1 … Read more

CSS 테두리 종류와 명령(border-style 속성)

by

CSS 테두리 종류 (border-style)의 종류에 대하여 알아보겠습니다. :nth-of-type(n){} 등의 태그를 통하면 간단하게 여러 태그에 CSS 테두리 종류 border-style 속성을 이용하여 테두리를 적용시켜볼 수 있습니다. 일단 태그 적용 전 기본적으로 쓰이는 간단한 속성 8가지를 간단히 확인해보고html과 css로 적용해 보겠습니다. css 테두리 종류 속성(border-style) solid, dotted, groove, double, inset, outset, dashed, ridge 등이 있습니다. 위 코드처럼 간단히 … Read more

css로 a태그 정렬하기(a tag 링크 태그 정렬)

by
css로 a태그 정렬하기(a tag 링크 태그 정렬)

a태그를 정렬하는 방법에 대해서 알아보겠습니다. css에서 가운데 정렬 명령을 줄 때, 주로 margin이나 text-align:center 등의 명령을 주어 정렬을 합니다. 아무 명령을 주지 않았을 때는 기본적으로 왼쪽 정렬 상태인데, 특정한 위치를 기준으로 정렬을 하려고 할 때 위처럼 명령을 해 주면 원하는 대로 정렬을 할 수 있습니다. 하지만, 주로 링크를 걸 때 사용하는 a태그는 블럭 요소가 아닌 … Read more