20240805~06수업 그동안 학습했던 것들을 이용하여 웹사이트를 제작할 수 있다. HTML 삽입미리보기할 수 없는 소스↑공통 스타일 시트적용법 HTML 삽입미리보기할 수 없는 소스-HTML 삽입미리보기할 수 없는 소스 HTML 삽입미리보기할 수 없는 소스newsHTML 삽입미리보기할 수 없는 소스HTML 삽입미리보기할 수 없는 소스HTML 삽입미리보기할 수 없는 소스 HTML 삽입미리보기할 수 없는 소스HTML 삽입미리보기할 수 없는 소스결과물http://127.0.0.1:5500/cafe/index.html

20240805수업Flex box display:flex HTML 삽입미리보기할 수 없는 소스justify-content(수평정렬)HTML 삽입미리보기할 수 없는 소스 align-items(한줄 수직정렬)HTML 삽입미리보기할 수 없는 소스 align-contents(여러줄 수직정렬)HTML 삽입미리보기할 수 없는 소스Gridgrid (flexbox(Flexible Box Layout Module)는 한줄용, grid는 한 테이블용)HTML 삽입미리보기할 수 없는 소스

20240802수업layout창을 만들땐 폴더를 따로 지정해주는 것이 좋다.ㅣlayout만드는 방식 1.table tag 2.div float style 3.html5 header 4.css flexbox 5.css frid Cities Lodon Paris Seoul Lodon London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants. Standing on the River Thames, London has been a major settlement for two millennia, its histo..

20240802수업 [앞서 알아두면 좋은 내용]client -(요청)-> server client 하나를 찾음 name="gender" : document.getElementsByname('gender') -> 여러개를 찾음 : document.getElementsByTagName('gender') -> 여러개를 찾음 class="" : document.getElementsByClassName('') -> 여러개를 찾음css선택자를 공부하는 이유스타일을 조작js를 조작jquery를 조작파이썬을 조작html을 서버로부터 다운받았을때 크롤링를 하기위해 특정태그를 지정해서 가져올때 docume~를 가져옴Pseudo-classes selector(선택자) - 어떤 상태일 떄 :으로 시작SelectorExampl..

20240801수업favicon형식 (rel:relation) 파비콘(favicon, 'favorites + icon') 또는 패비콘이란 인터넷 웹 브라우저의 주소창에 표시되는 웹사이트나 웹페이지를 대표하는 아이콘favicon사이트: https://favicon.io/emoji-favicons/ogre/ Favicon.io - The Ultimate Favicon Generator (Free)With Favicon.io you can quickly generate a favicon for your website for free!favicon.io 태그는 클라이언트 측 이미지 맵을 정의하는 데 사용됩니다. 이미지 맵은 클릭 가능한 영역이 있는 이미지입니다. 요소의 필수 name 속성은 의 usemap 속성..

20240801수업 Link Button '눈떠보니 월드스타' 김예지, 조회수 4000만회 세계적 폭발 링크 버튼 link button link button HTML 삽입미리보기할 수 없는 소스 height대신 padding을 쓰는 이유:block태그는 vertical align이 적용x td에서는 먹지만 a태그에는 inline-block을 줘도 vertical 적용xtable(block)은 vertical-align이든 padding이든 다 먹히긴 한다. 그런데 block태그와 inline태그에서는 태그에따라서 적용될 수 있는 속성이 다르기때문에 여러가지 속성을 활용해 볼 수 있도록 할 것. 참고:https://www.w3.org/TR/CSS2/tables.html#height-layout Tables..

20240731수업1 이문세 붉은 노을 50 2 아이유 붉은 노을 26 3 빅뱅 붉은 노을 27 위와 같은 형식을 한국인이 보면 이문세가 나이가50이고 노래제목이 붉은 노을, 아이유라는 가수의 나이가 26이고 노래제목이 붉은 노을, 빅뱅이라는 가수의 나이가 27세이고 노래제목이 붉은 노을이라는 것을 단번에 파악할 수 있지만, 한글을 모르는 외국인은 각 항목이 무엇을 의미하는지 단번에 파악하기 힘들다 그래서 다음과 같은 방식들을 통하여 표현할 수 있다. [XML] (eXtensible Markup Language) version="1.0" encoding="utf-8 ?> 1 이문세 붉은노을 50 2 아이유 붉은노을 26 3 빅뱅 붉은노을 27 마크업 언어(markup language)는 태그 등을 이용하..

20240731수업 지난 포스팅에서 다뤘던 input type태그, table태그, a태그 등을 이용하여 로그인창과 회원가입창을 구현해보겠습니다. 로그인 로그인 아이디 암호 See the Pen Untitled by 유레이나 (@zdixexqp-the-reactor) on CodePen. 회원가입 회원가입 이름 주민번호 - 아이디 비밀번호 비밀번호 확인 이메일 @ 직접 입력 naver.com gmail.com daum.net kakao.com 우편번호 주소 핸드폰번호 선택 010 011 013 016 017 018 019 - - 직업 학생 컴퓨터/인터넷 언론 공무원 메일/SMS정보 수신 수신 수신 거부 관심분야 생두 원두 로스팅 핸드드립 에스프레소 창업 자기소개 HTML 삽입미리보기할 수 없는 소스nam..

20240731수업 input type 종류input tupe 형식 HTML INPUT type button: button: :버튼 text(userid): password(passwd): hidden(page): radio checkbox image file submit reset email search tel color url number range date datetime-local month week time string color HTML 삽입미리보기할 수 없는 소스 type의 기본값은 "text"임.XML : extensible markup language •markup language(태그를 가지고 쓰는 언어)의 기준 언어-인터넷 문서 표현 html, data -> xml 규칙..

20240731 수업 프로젝트를 시작하면, 초기에 먼저 스타일시트를 초기화하고 시작하는 것이 좋다. 이렇게 초기화를 해주는 이유는 브라우저마다 기본으로 제공하는 스타일이 있기때문이다. 예를 들면 내가 margin을 지정하지 않았는데도, 알아서 margin값이 들어있어서 내가 원하는대로 화면을 가득채우는 것이 불가능하다. 아래의 사진은 width를 100%로 주었음에도 불구하고 자세히보면 margin값으로 인해 화면을 가득채우지 못하고 있는 것을 볼 수 있다.그래서 개발자가 의도한대로 디자인이 나오게 하기위해서는 이러한 설정을 다시 리셋해주는 과정을 거쳐야한다. (프로젝트를 이미 많이 진행하고 난 뒤에 바꾸는 것은 더 어려우므로 프로젝트 초기에 먼저 설정한 뒤 시작하는 것이 좋다)참고:https://hih..