본문 바로가기

분류 전체보기395

HTML 태그 - 서식에 사용되는 태그들 html에서 코딩을 작성할 때 아무리 엔터나 스페이스를 눌러서 공간을 띄어도 실제 보이는 화면에서는 줄 바꿈이 일어나지 않는다. 따라서 서식을 꾸미는 태그들이 따로 존재한다. 서식은 문서를 꾸미는 형식을 말하는데, 글자의 크기, 글자의 색, 글자의 정렬을 조절한다. 서식에 사용되는 태그들 제목 h1 제목 h2 제목 h3 제목 h4 제목 h5 제목 h6 제목을 나타내는 태그 태그 안에 글씨를 굵게 보이는 속성이 포함되어 있다. 숫자가 작을수록 화면에 크게 나타난다. 한 줄 띄어쓰기 태그, 닫는 태그가 없다. 가로줄 태그, 닫는 태그가 없다. 문단 태그로, 문단 사이에 줄 바꿈이 일어난다. 굵은 텍스트 중요 텍스트, 매우 중요한 텍스트를 정의 기울임 꼴 텍스트 기울임꼴 텍스트, 강조 텍스트를 정의 표시된 텍.. 2023. 2. 6.
파일 확장자란? 코딩을 하다 보면 확장자에 대해서 알아야 할 때가 있다. 확장자는 무엇이고 어떻게 확인해야 할까? 파일 확장자(filename extension)란? 컴퓨터 파일의 이름에서 파일의 종류와 그 역할을 표시하기 위해 사용하는 부분이다. 간단히 확장자라고도 한다. 많은 운영 체제들은 파일 이름에서 마지막 점(.) 뒤에 나타나는 부분을 확장자로 인식한다. 파일 확장자 확인방법 1. 내가 알고 싶은 파일만 확인하는 방법 확장자 확인을 원하는 파일에 마우스를 놓고 우클릭 > 속성 > 일반 - 파일형식을 확인한다. 2. 파일 전체 확인하는 방법 아무 폴더를 열어서 보기 > 파일확장명 체크 자동으로 파일 확장자가 생기는 것을 확인할 수 있다. 자주 사용하는 확장자의 종류 .txt : 일반 텍스트 .pdf : PDF(P.. 2023. 2. 5.
HTML 요소 - inline-element, block-element HTML의 모든 요소에는 요소 유형에 따라 기본 표시 값이 있다. 표시 값에는 inline-element, block-element 두 가지가 있다. 이 표시값에 따라서 사용할 수 있는 속성 태그가 달라진다. inline-element 인라인 요소는 새 줄에서 시작하지 않는다. 인라인 요소는 필요한 만큼의 너비만 차지한다. 대표적으로 사용되는 요소는 단락의 내부에서 사용되는 요소 요소는 텍스트의 일부 또는 문서의 일부를 표시하는 데 사용 참고: 인라인 요소는 블록 수준 요소를 포함할 수 없다! 예시> 공간크기로 보는 인라인요소 span 태그는 내부적인 요소로 Hello World 필요한 너비만큼만 작동한다. span 요소는 인라인 요소로, 새 선에서 시작하지 않고 필요한 만큼의 너비만 차지한다.(빨간박스.. 2023. 2. 5.
CSS 결합자(combinators)란? 초보자들은 흔히 특정태그를 선택하기 위해 태그 하나하나에 다른 클래스를 달아주곤 하는데, 작은 프로젝트에서나 상관없지만 큰 프로젝트일수록 비효율적이다. 특히, 협업을 하는 경우에는 더욱 더 비효율적. 태그 하나하나에 클래스를 두면 1. 만든 클래스 이름을 다 기억하지도 못할뿐더러 2. 이 클래스가 도대체 무슨 효과를 주는지 하나하나 짝지으며 찾아다녀야 한다. 그럼 어떻게 해야 할까? 결합자(combinators)를 활용해 코드를 짜는 것이다. 결합자(Combinator)는 선택자를 여러 개 결합하여 세밀하게 찾을 수 있게 한다. 결합자는 크게 네 가지로 나눌 수 있다. 결합자에 대해서 알려면 HTML의 구조에 대해서 알아야 한다. HTML의 구조 "어떤 요소 안에 어떤 요소가 있느냐"를 이해하는 것이 가.. 2023. 2. 4.
CSS에 대한 보충 설명 1. CSS를 사용하는 이유 태그 내에 style속성을 사용하여 서식을 지정하는 것은 사실 좋은 방법이 아니다. 홈페이지들은 웹문서하나가 몇천 줄로 이루어져 있고, 이를 모두 일일히 변경한다는 건 사실상 불가능하다. 한번에 일괄적으로 변경을 하기 위해서 css라는 기능이 생겨난 것 css를 사용하면 한 번의 클릭만으로 컴퓨터나 핸드폰의 테마를 변경할 수 있듯이 웹문서의 서식을 일괄적으로 지정할 수 있게 된다. 2. 아이디를 하나만 지정하는 이유 사실 HTML과 CSS에서는 하나의 웹페이지에 같은 아이디를 여러 번 사용해도 별문제 없이 동작하긴 한다. 하지만 이렇게 중복된 아이디를 가지고 자바스크립트작업을 하게 되면 오류가 발생하기 때문에, 하나의 id는 한 번만 사용하는 습관을 들여야 한다. 2023. 2. 3.
프론트엔드? 백엔드? 웹 또는 *모바일 솔루션(mobile solution) 개발은 크게, 프런트엔드와 백엔드 두 가지 영역으로 나눈다. 클라이언트와 서버라고도 한다. 프런트엔드(클라이언트) 프런트엔드란, 우리의 눈에 직접적으로 보이는 화면을 구성하는 모든 요소를 말한다. 지금 우리가 모니터를 통해보고 있는 웹 또는 모바일화면의 레이아웃, 텍스트, 그림 등이 해당된다. 프런트엔드개발자는 사용자에게 보이는 화면을 구성하고, 사용자들과 상호작용하는 모든 것을 개발한다. 즉 웹 또는 모바일 솔루션의 사용자인터페이스(UI)와 사용자경험(UX)을 만드는 역할을 한다. 프런트엔드를 가장 쉽게 이해할 수 있는 방법은 홈페이지를 직접 만들어보는 것이다. 백엔드(서버) 백엔드란, *솔루션(solution)의 프로세스와 관련된 서버 측이나 데.. 2023. 2. 2.

티스토리툴바