본문 바로가기

728x90
반응형
SMALL

프론트엔드/HTML&CSS

(24)
옵셔널 태그_<html>,<head>,<body> 태그 이전의 실습에서 작성했던 코드에 세 옵셔널 태그를 추가해보자. https://2myona.tistory.com/199 HTML과 CSS_CSS 기본 문법_VS Code로 실습 해보기 오늘은 이전까지 실습했던 HTML에 추가로 CSS를 배워보자. 간단히 얘기하면, HTML = "내용" CSS = "스타일" 사이트에 CSS 스타일을 입혀주기 위해 태그를 사용할 수 있다. 위의 기본 문법을 참고해서 이 2myona.tistory.com 이 실습에서 사용했던 코드이다. (두번째 코드) 여기에 세 태그를 추가한 모습은 다음과 같다. 태그는 모든 코드를 둘러싼다. 태그는 웹사이트에 표시될 내용만을, 태그는 그 외의 것들을 둘러싼다. 꼭 써야할까? 의견이 분분하나, organize의 목적으로 세 태그를 모두 사용하는..
CSS 기본 속성 정리_스타일링 종류_폰트 크기, 여백, 색, 정렬 일단 CSS 스타일을 입혀주기 위해서는 태그를 사용해야 한다. 이제 기본적으로 스타일링할 수 있는 종류를 알아보자. - 폰트 크기 : px(픽셀)을 가장 많이 사용 - 텍스트 정렬 : 글을 왼쪽, 가운데, 오른쪽으로 정렬 가능 각각 left, center, right 로 써주면 됨 - 여백 : margin 속성 이용 여백의 크기도 px 단위로 설정 여백의 위치는 위, 아래, 왼쪽, 오른쪽 가능 각각 top, bottom, left, right 으로 써주면 됨 - 글씨 색 : color 속성 이용
HTML과 CSS_CSS 기본 문법_VS Code로 실습 해보기 오늘은 이전까지 실습했던 HTML에 추가로 CSS를 배워보자. 간단히 얘기하면, HTML = "내용" CSS = "스타일" 사이트에 CSS 스타일을 입혀주기 위해 태그를 사용할 수 있다. 위의 기본 문법을 참고해서 이전의 실습에 스타일링을 추가해보자. CSS 스타일링 종류 https://2myona.tistory.com/200 CSS 기본 속성 정리_스타일링 종류_폰트 크기, 여백, 색, 정렬 일단 CSS 스타일을 입혀주기 위해서는 태그를 사용해야 한다. 이제 기본적으로 스타일링할 수 있는 종류를 알아보자. - 폰트 크기 : px(픽셀)을 가장 많이 사용 - 텍스트 정렬 : 글을 왼쪽, 가운데, 2myona.tistory.com 이전의 실습 참고 https://2myona.tistory.com/181 H..
HTML_한글이 깨지는 현상 방지 우리가 VS Code에서 html 코드를 작성하고, 이를 어떤 브라우저에서 실행하는가에 따라 한글이 깨지는 현상이 발생하기도, 발생하지 않기도 한다. 예를 들어, 크롬에서 실행하면 한글이 깨지는 현상은 발생하지 않는다. 그러나, 한글을 지원하지 않는 사파리에서 실행할 경우 다음과 같이 한글이 깨지는 현상이 발생한다. 이를 방지하려면 어떻게 해야할까? 한줄의 코드를 더 추가해주면 된다. 이전의 코드와 달라진 점이 무엇일까? 이 코드가 추가되었다는 점이다. 이 코드를 추가해줌으로써 한글 깨짐 현상을 방지할 수 있다. 이 코드를 실행해보면 한글깨짐 현상이 발생하지 않고 잘 실행된다.
HTML_글씨 굵게 쓰기/날려 쓰기 실제로 해보자. 이전에 썼던 코드에서 조금만 변형을 해보았다. https://2myona.tistory.com/180 HTML_VS Code, Live Server 설치/html 기본 태그 정리/html 코드 작성 Visual Studio Code라는 도구를 사용할 것이다. https://code.visualstudio.com/ Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and.. 2myona.tistory.com 참고. 실행시켜 보자. 이렇게 내가 원한 부분이 굵게, 그리고 기울여져서 나타나 있다. 이 밑은 참고. * Phrase Tag..
HTML_VS Code, Live Server 설치/html 기본 태그 정리/html 코드 작성 Visual Studio Code라는 도구를 사용할 것이다. https://code.visualstudio.com/ Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. code.visualstudio.com 위의 주소에서 다운받을 수 있다! VS Code 를 다운받았다면, VS Code 를 실..
# HTTP_요청 (Method) : 클라이언트가 웹서버에게 사용자의 요청의 목적/종류를 알리는 수단 HTTP는 요청 메서드를 정의하여 -> 주어진 리소스에 수행하길 위하는 행동을 나타낸다. 그래서 요청 메서드를 "HTTP 동사"라고 부르기도 한다. GET : 특정 리소스의 표시를 요청 오직 데이터를 받기만 한다. 정보 검색 ex) 게시판 리스트 불러오기 HEAD : GET 메서드의 요청과 동일한 응답을 요구하지만, 응답 본문 포함 X POST : 특정 리소스에 엔티티를 제출할 때 사용 종종 서버 상태의 변화/부작용 일으킴 실행 / 저장 ex) 회원가입 / 로그인 PUT : 목적 리소스의 모든 현재 표시를 요청 patload로 바꿈 ex) 회원정보 전체 수정 DELETE : 특정 리소스를 삭제 ex) 회원정보 삭제 CONNECT : 목적..
# HTTP_완젼 기초 : HTML 문서를 주고 받는 데에 쓰이는 통신 프로토콜(=통신 규약) TCP, UDP 사용하여 통신 80번 포트를 사용 * 통신 프로토콜 (=통신 규약) : 컴퓨터나 원거리 통신 장비 사이에서 메세지를 주고 받는 양식과 규칙의 체계 - HTTP 특징 : 서버, 클라이언트에 의해 메세지가 해석된다. TCP/IP를 이용하는 응용 프로토콜이다. 클라이언트가 이전에 요청했던 내용을 기억하지 않는, 비연결성 프로토콜이다. -> 이 단점을 해결하기 위해 -> Cookie, Session이 등장 -> 비연결성 프로토콜이므로, 요청/ 응답 방식으로 동작한다. HTML 문서만이 HTTP 통신을 위한 유일한 정보문서는 아님 - HTTP 통신 과정 (요청&응답) 1) 클라이언트(=사용자)가 -> 서버에 요청(HTTP re..

728x90
반응형
LIST