목록Development/Network & Web (36)
컴공생의 다이어리
도메인(Domain)이란? 도메인은 인터넷에 연결된 컴퓨터의 ip를 사람이 쉽게 기억하기 어렵기 때문에 이를 위해서 각 ip에 사람이 쉽게 기억하고 입력할 수 있도록 문자(영문, 한글 등)로 만든 인터넷 주소이다. 도메인 체계 도메인은 “.”또는 루트(root)라 불리는 도메인 이하에 아래 그림과 같이 역트리(Inverted tree)구조로 구성되어 있다. 아래와 같이 3단계로 구분된다. 1단계 : 최상위 도메인(TLD, Top-Level Domain) 도메인 레벨 중에 가장 높은 단계에 있는 도메인이다. 7 개의 일반도메인(com, net, org, edu,, gov, mil, int)과 + 190여개의 국가 도메인(kr, de, jp..)으로 구성되어 있다. 1단계 도메인은 도메인의 목적, 종류, 국..
입력값이 보이지 않을 때 input type을 password로 지정해 비밀번호를 받으려고 하니 기호(●)없이 입력되는 문제가 발생했다. 이런 현상이 발생하는 이유는 나눔스퀘어 폰트를 사용하고 있었기 때문이다. 물론 다른 폰트를 사용해도 이와 같은 문제가 발생할 수 있다. 이런 문제가 발생하는 폰트에는 ● 문자를 지원하지 않아서이다. 해결방법 아래와 같은 형식으로 css 코드를 추가해주면 된다. input[type=password]안에는 ● 문자를 지원하는 폰트를 넣으면 된다. 아래 코드에는 구글 폰트를 넣어놨는데 언제까지 될지는 모르겠지만 저대로 써도 아마 작동할 것이다. input[type=password]::placeholder를 사용하지 않아도 되지만 기존에 사용하던 글씨체와 통일성을 주기 위해서..
(VS Code를 기준) 들여쓰기 들여쓰기를 할 영역을 드래그 하고 [Tab]을 눌러주면 된다. 내어쓰기 내어쓰기를 할 영역을 드래그 하고 [Shift+Tab]을 눌러주면 된다. 여러코드 주석지정/해제 주석지정을 하거나 해제를 하고 싶은 영역을 드래그 하고 [ctrl+/]를 눌러주면 된다. dasima.xyz/html-comments/ HTML 주석 처리 예제 및 디버깅과 단축키 | TIMECRAFT HTML 주석 처리는 한줄과 여러줄 동일하게 부등호, 느낌표, 하이픈 기호 조합으로 구성됩니다. 주석으로 디버깅 효과를 흉내낼 수도 있습니다. atom, visual studio, codpen 등에서 주석 단축키도 존재합 dasima.xyz
goorm(구름) ide로 html/css/js 실습환경 만들기 우선 구름 ide를 짧게 소개해보자면 프로그램 설치 과정 없이 컨테이너를 생성하는 것으로 개발환경을 자동 구축하는 클라우드 iDE이다. 이제 구름 ide에서 html/css/js 실습환경을 만들어보자! 1. 구름 ide에 접속 후 로그인 진행(회원이 아니라면 회원가입을 해야함) 2. 로그인을 하면 다음과 같은 화면이 나타나는데 여기서 새 컨테이너 생성을 클릭 (혹시 위의 화면이 바로 나오지 않는다면 구름 ide에서 대시보드를 클릭) 3. 아래와 같이 기본 설정(필요한 부분은 각자 설정에 맞게 변경)을 한 뒤 생성 버튼 클릭 4. 바로 생성한 컨테이너를 실행하고 싶다면 컨테이너 실행을 클릭 5. index.html을 클릭하고 Open Prev..
html 웹페이지의 시작과 끝 구성 : ... cf) 문서유형을 지정해서 웹브라우저가 페이지를 어떻게 해석해야 하는지 알려줌 ex) : 이 페이지는 html로 해석해야 함! head(머리말) 웹페이지의 정보, 문서에서 사용할 외부 파일들을 링크할 때 사용 구성 : body(본문) 브라우저에 실제 표시되는 내용 구성 : ... meta(정보에 대한 정보를 알려줌) 문자 인코딩 및 문서 키워드, 요약 정보 구성 : ex) : 웹페이지의 문자 인코딩 방식을 utf-8로 지정 title(문서 제목) 안의 내용이 웹브라우저의 제목 표시줄에 표시 구성 : ... p(단락) 를 사용하면 내용 앞 뒤로 빈줄이 생기면서 단락이 생김 구성 : ... h1~h6(제목) 이 글자 크기가 제일 크며, 로 갈수록 글자 크기가 작..
웹사이트는 크게 아래와 같이 3가지 요소(HTML, CSS, JS)로 구성된다. HTML(Hyper Text Markup Language) 하이퍼 텍스트 마크업 언어 하이퍼 텍스트 : 참조(하이퍼링크)를 통해 한 문서에서 다른 문서로 즉시 접근할 수 있는 텍스트 마크업 언어 : 문서의 구조를 표현하는 역할 웹페이지를 만들기 위하여 사용하는 언어 웹페이지에서 제목, 이미지, 동영상, 문단, 표, 등을 정의하고 그 구조와 의미를 부여하는 정적 언어 웹의 구조를 담당 CSS(Cascading Style Sheets) 캐스캐이딩 스타일 시트 캐스캐이딩 : '계단식, 위에서 아래로 흐르는'을 의미 스타일 시트 : 글꼴의 크기, 모양, 컬러, 문단 설정 등 미리 정의해 스타일로 만들었다가 웹 문서의 본문에서 그 스..