본문 바로가기
728x90
반응형

분류 전체보기330

비주얼 스튜디오 코드⑫ css 외부링크 만들기, css 링크 불러오기 비주얼 스튜디오 코드 > new file > 파일 이름: style.css 새파일 생성 > @charset "utf-8" (셋팅을 한국어로 만들어준다[기본 셋팅코드] a태그: 링크 걸어주는 태그img{ display: block; }: 인라인 구조이기 때문에 블럭구조로 변경(여백을 없애줌) new file > index.html 파일에서 head에 style.css 링크 달아서 외부에서 불러오기DOCTYPE html>html lang="ko">head>    meta charset="UTF-8">    meta http-equiv="X-UA-Compatible" content="IE=edge">    meta name="viewport" content="width=device-width, initial-.. 2023. 6. 2.
[BOOK]혼자 공부하는 얄팍한 코딩지식_Chapter 01-1 CHAPTER 01 개발자 이해하기: 개발과 개발자 용어 알기01-1 개발자는 대체 뭐하는 사람인가요?개발자가 하는 일은 작가가 하는 일과 비슷하다. 무에서 유를 창조하고 누군가를 이해할 수 있도록 작성하는 것도 비슷하다. 차이점이 있다면 작가는 사람이 이해할 수 있는 언어로 작성하지만, 개발은 컴퓨터가 이해할 수 있는 언어로 작성한다. 작가는 종류에 따라 여러종류의 작가가 있는 것처럼, 개발자도 무엇을 개발하느냐에 따라 여러분야의 직군으로 나뉜다. 개발자는 종류마다 사용하는 프로그래밍 언어도 다르고 쌓아야하는 지식도 다르다. 웹 개발자웹사이트를 만드는 개발자 웹 개발자는 윌가 PC나 스마트폰에서 웹서핑을 하며 방문하는 각종 웹사이트는 웹 개발자가 만든다. 일반 프로그램이나 모바일 앱으로 알고 사용하는 .. 2023. 5. 27.
직장인 코딩 용어 해설② 웹서비스 동작방식 어? 서버 터졌네 = 접속자 폭주 서버란? 가운데서 데이터를 저장하고 주는 것 서버를 통해 정보를 주고 받고 한다. 즉, 서버란 "컴퓨터라는 사람의 직업과 같은것 (DB,웹서핑도 가능!) 웹은 어떻게 동작하는 걸까? 브라우저의 역할? 요청을 보내고 받아서 그대로 그려줌 HTML: 뼈대 CSS: 예쁘게 꾸며주기 Javascript: 동작 웹사이트의 기초적인 구성요소 : HTML, CSS, Javascript 하지만 매번 페이지를 로딩 할 수 없고 데이터만 갈아끼우고 싶을 수도 있다. 그럴 떄는 데이터만 내려줄 수 있다. 그런데 아무렇게나 줄 수는 없으니, 줄 때도 규칙이 필요하다. 그러한 규칙이 {JSON} 제이슨 방식 키: 밸류 라고 한다~ 중괄호로 계속해서 이어지는게 제이슨방식의 특징 JASON은 앱에.. 2023. 5. 27.
직장인 코딩 용어 해설 ① 컴퓨터와 인터넷 [컴퓨터와 인터넷] 컴퓨터: 기계를 모아 둔 것 하드디스크 : 적어둔다 RAM: 기억하기 CPU: IQ, 계산하기 . CPU가 좋으면 빨리 계산할 수 있다. 메인보드: 하드디스크, RAM, CPU 를 한 번에 꽂아두는 곳 컴퓨터를 어떻게 조작할까? 운영체제로 조작한다, 운영체제: 인간이 기계와 소통할 수 있게 만드는 기반 프로그램 ex) android, ios, windows, linux linux: 오픈소스로 무료로 사용가능 OS에 명령을 내리는 것이 " 코딩 " 코딩: 운영체제에 명령을 내린다. 명령을 내릴 때 어떤 언어든 상관없다. 프로그래밍 언어: 어떤 말로든 명령을 내리면 됨. ex) JAVA, PYTHON, php, c++, scala, javascript, c#, node, ruby 프로그램.. 2023. 5. 27.
비주얼 스튜디오 코드⑪ 네비게이션, 이미지 넣기 #header = = = : header의 역할만 함 : div와 똑같은 역할 border: 테두리선 wrap에 높이값 넣지 않는다. 그 이유는 wrap의 높이 값이 고정되어있으면 유동적으로 수정이 불가능 01 웹디자인 참고 사이트 본문 폰트크기 : 13px -14px 눈누: 눈누 (noonnu.cc) 구글폰트: Browse Fonts - Google Fonts Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com Color - Materialize (materializecss.com) Color - Materialize To apply a background color, jus.. 2023. 5. 26.
비주얼 스튜디오 코드⑩ 레이아웃 심화 index: 홈페이지 주소 뒤에 index.html이 숨어있음, 홈페이지 창을 불러오겠다는 뜻 https://www.naver.com/index.html 네이버 네이버 메인에서 다양한 정보와 유용한 컨텐츠를 만나 보세요 www.naver.com body: 골격 css: 골격을 꾸미는 스타일 언어 스크립트: 동작하게 하는 언어 padding: 안 쪽 여백, 블럭이 패딩값만큼 늘어남 그래서 패딩값만큼 포함해서 블럭 w / h 조정해야함 box-sizing: border-box; padding 값 계산없이 w / h를 패딩값 포함하여 알아서 크키조정해줌 *{} 전체 태그에 적용해줌 margin: 바깥 쪽 여백 모두 0으로, 즉 초기화 해줘야 위치계산할 때 편리함 margin=0; padding=0; *{} 전.. 2023. 5. 26.
728x90
반응형

티스토리툴바