html, css, js
-
[CSS] 스타일 시트 종류/ CSS 기본 선택자 / 스타일 우선순위html, css, js 2023. 2. 12. 01:55
CSS 스타일 형식 선택자 { 속성1 : 속성값1; 속성2: 속성값2;} 맨 앞 선택자는 스타일을 어느 태그에 적용할 것인지를 알려주는 것이고, 중괄호 사이에는 스타일 정보를 넣는다. 속성과 값이 하나의 쌍으로 이루어진 것을 스타일 규칙이라고 하며, 세미콜론으로 구분해서 스타일 규칙을 여러개 지정할수있다. CSS 주석 표시 /* */ HTML주석은? #스타일 시트 종류 웹 문서 안에서는 스타일 규칙을 여러개 사용한다. 브라우저 기본 스타일 CSS를 사용하지 않은 웹 문서라 하더라도 웹 브라우저에 표시할때는 기본 스타일을 사용하는데 이것을 브라우저 기본스타일이라고한다. 예)HTML의 p태그 h1태그 등 인라인 스타일 간단한 스타일 정보라면 스타일 시트를 사용하지 않고 스타일을 적용할 대상에 직접 표시한다...
-
[HTML] form 태그html, css, js 2023. 2. 10. 16:09
아이디와 비밀번호를 입력하거나 로그인 버튼, 회원 가입 등 사용자가 웹 사이트로 정보를 보낼 수 있는 요소를 모두 폼이라고 할 수 있다. 텍스트 박스나 버튼 같은 폼 형태는 HTML 태그로 만든다. 그러나 폼에 관련한 작업인 정보를 저장하거나 검색 수정하는 것은 모두 데이터베이스를 기반으로 하므로 폼에 입력한 사용자 정보는 JSP, PHP, Spring같은 백엔드 프레임워크를 이용해야한다. 폼을 만드는 태그 여러 폼 요소 태그의 속성 method 사용자가 입력한 내용을 server로 어떻게 넘겨줄 것인지 지정한다. method에서 사용할수있는 속성값은 get,post이다. get: 데이터를 256~4096byte까지만 서버로 넘길 수 있다. 주소 표시줄에 사용자가 입력한 내용이 그대로 드러난다. post..
-
[HTML] HTML 태그 모음html, css, js 2023. 2. 9. 13:24
텍스트 관련태그 : 제목. ~까지 사용할 수 있으며 숫자가 커질수록 글자 크기는 작아진다. : 텍스트 단락, 내용이 길면 웹 브라우저 창의 너비에 맞게 자동으로 줄 바꾼다. : 줄 바꿈, 텍스트 단락 중 원하는 위치에 줄 바꾼다. : 내용인용, 다른 내용보다 들여쓰고 단락으로 표시한다. : 중요한 텍스트를 굵게 표시, 화면 낭독기에서 강조 : 텍스트 굵게 표시 : 중요한 텍스트를 기울게 표시, 화면 낭독기에서 강조 : 기울게 표시 : 내용을 편집할때 추가한 내용을 표시 : 내용을 편집할때 삭제한 내용을 표시 : 위첨자 : 아래 첨자 : 구분선 목록 관련 태그 : 순서있는 목록의 시작과 끝을 나타냄 : 순서없는 목록의 시작과 끝을 나타냄 : 순서있는 목록이나 순서없는 목록의 각 항목을 나타냄 : 설명 목록..
-
[HTML] 웹 문서에, 내용 입력하는 태그들html, css, js 2023. 2. 9. 13:15
#텍스트 입력하기 제목 태그 : n의 자리에는 1~6의 숫자가 들어가며 1부터 6으로갈수록 제목 크기가 작아진다. 레드향 레드향 샐러드 레시피 상품 구성 텍스트 단락을 만드는 태그: 태그 사이에 텍스트를 입력하면 텍스트 앞뒤로 빈줄이 생기면서 텍스트 단락이 구분된다. 편집기에서 줄을 바꾸더라도 웹브라우저에서는 한줄로 표시된다. 레드향 껍질에 붉은 빛이 돌아 레드향이라 불린다. 레드향은 한라봉보과 귤을 교배한것으로 일반 귤보다 2배크다 어쩌고 줄바꿈 태그: - 닫는 태그가 필요없고, 원하는 위치에 넣어 줄바꿈을 할 수 있다. 인용문 : - 태그 안에 내용을 인용문으로 알고 들여쓰기한다. , : - 태그 내부에 텍스트를 굵게 표시한다. 태그는 보이는것으론 텍스트를 굵게 표시하는 태그와 동일하지만, 화면 낭독..
-
[HTML] 기본 구조 태그들html, css, js 2023. 2. 3. 13:41
HTML(HyperText Markup Language) : 웹 브라우저에 보여줄 내용을 마크업하고 문서끼리 링크하는 언어 HyperText 문서를 서로 연결해주는 링크, Markup 웹 브라우저의 내용을 보여주는 텍스트, 이미지, 영상 등의 위치를 표시한다. 태그 : 웹브라우저가 어느 부분이 제목, 텍스트, 표인지 구별할 수 있는 꼬리표 HTML 기본구조 프론트엔드 웹 개발 HTML CSS 자바스크립트 : 현재 문서가 HTML5 언어로 작성한 웹 문서라는 뜻 ~ : 웹 문서의 시작과 끝을 나타내는 태그로 웹 브라우저는 사이 소스를 읽어 화면에 표시한다. : 웹 브라우저가 웹 문서를 해석하는데 필요한 정보를 입력하는 부분, 문서에 사용할 스타일 시트 파일도 이곳에서 연결 ~ : 실제로 웹 브라우저 화면에..
-
Do it 웹 표준의 정석 !! <웹 개발>html, css, js 2023. 2. 3. 00:27
파이썬 문법, 크롤링 OK JAVA 문법 OK HTTP 메소드 OK 프론트엔드 html,css,js 이제 시작!!ㅎㅎ Git 아직 Spring, spring boot .. mvc.. DB.. OS.. 코딩테스트 준비.. 아직 2주안에 끝낼수있도록 커리큘럼이 짜여져있는 책이라 빠른시간내에 프론트앤드 공부를 짚고 넘어갈수있다고 생각이 들었고.. 이쪽 분야에선 꽤나 유명한 책이라고 들었다. 일단 책한권으로 프론트앤드 맛보기 정돈 가능하니까 효율 끝판왕? 무엇보다 마지막 부록으로 직접 웹사이트를 만드는 프로젝트가 있다. 웹 사이트는 인터넷에 연결된 컴퓨터(서버)에 정보를 전달한다. -> 서버는 요청에 대한 결과를 웹 브라우저에게 보여준다. 인터넷에 연결된 컴퓨터를 서버라고 한다. 서버에는 웹 사이트에 접속하면 ..