Programming/Web Programming (2021) (23) 썸네일형 리스트형 [웹프로그래밍] 7. CSS 셀렉터와 스타일 속성 셀렉터와 스타일 속성 기본 셀럭터와 셀렉터마다 HTML 요소에 접근하는 방법 CSS 디버깅하고 테스트하는 좋은 방법 : 크롬의 검사기능 1. 셀렉터 스타일을 적용하는 대상을 지정하는 방법 태그, 아이디, 셀렉터를 사용 태그에서 사용하는 id 속성은 문서내 유일한 값으로 중복되지 않는다. 클래스는 미리 정의하고 그 클래스 속성으로 스타일을 지정한다. 셀렉터 예 설명 .class .inro html 태그에서 intro인 클래스로 된 모든 태그 영역 #id #banner html 태그에서 banner인 id로 된 태그 영역 * * 문서 내 모든 요소를 선택 태그 p 문서 내 모든 태그 영역 선택 태그, 태그 div, p 모든 와 태그 영역 선택 태그 태그 div p 태그 안에 있는 모든 태그 영역 선택 2. .. [웹프로그래밍 프로젝트] 1. HTML로 포탈 메인화면 만들기 언더케이지 닷컴이라는 전문리뷰사이트를 HTML만을 이용해 메인화면를 만들어 본다. underkg.co.kr/ UNDERkg 세상의 모든 1KG 이하 제품 리뷰, 스마트폰 개봉기, 사용 평점, 사용 동영상 등 수록 underkg.co.kr review news opinion community shop fix event rental Log in Sign Up GADGET NEWS [루머] ZTE Axon 30 Ultra, $1,200에 판매[2] 삼성전자, 갤럭시 스마트 태그 플러스 미국 출시 노키아, 안드로이드 Go 탑재 스마트폰 2종 발표[1] 기아, K8 출시[1] 삼성 갤럭시 A 퀀텀2 추가 유출[8] 노키아, 최대 36시간 사용 Lite Earbuds 발표[2] 화웨이 P50 추정 실기 유출[4] .. [웹프로그래밍 실습] 1장. HTML Q-1. 테이블 병합 1 2 3 4 5 6 7 8 Q-2. 가입 신청서 만들기 First name: Last name: Email: Gender : Male Female Other Favorite : HTML, Java, PHP University : Gachon University Seoul University Yeonsei University Donguk University Color: Date : [웹프로그래밍] 5. 입력양식 1. 입력 양식 개요 웹에서 사용자에게 정보를 입력 받을 때 사용하는 사용자 인터페이스 태그 텍스트 입력, 선택, 버튼, 파일 첨부 가능 버튼은 이벤트처리를 위해 자바스크립트와 연동 파일 첨부는 서버에서 구현이 필요함 Shipping Address name: Address: City: State: zip: -> 태그를 통해 작성된 입력 양식은 method와 action을 이용해 입력 데이터를 서버에 전송한다. -> method : 웹 서버와 데이터를 전달하는 방법 지정 get 방식 : 서버에 데이터를 요청해 결과를 받기 위한 방식 [크기 제한이 있고, 보안성 떨어짐] post 방식 : 서버에 데이터를 전송하기 위한 방식 [크기 제한이 없으며 ,보안성 높음] -> action : 입력 받은 값을 전송할 서.. [웹프로그래밍 실습] 5. 입력양식 5-1) 입력양식 활용 - 검색창 만들기 html-11.html : Naver search search: [웹프로그래밍 실습] 4. 이미지와 테이블 4-1. 이미지 태그 활용-url 4-2. 이미지 태그 활용-로컬이미지 4-3. 테이블 만들기 no. name email tel 1 James Kang james@newyork.ac.kr,010-1234-1234 2 Justin Born justin@google.com Mariata Kumba kumba@amazon.com 010-2222-3333 4 Mola Lnada mola@naver.com 010-4444-5555 [웹프로그래밍] 4. 이미지와 테이블 1. 이미지 : 웹 화면에 이미지를 넣는 태그 -> 보이는 크기만 줄이며, 너비나 높이 중 하나의 크기만 줄이면 비율을 유지하면서 줄이게된다. -> 경로는 기본적으로 상대경로를 사용하고, url을 이용해서 다른 웹사이트에서 가져올 수도있다. -> %를 사용하면 브라우저 크기에 따라 이미지 크기가 조절된다. 1) 이미지 파일 종류 jpg/jpeg gif bmp png svg ->벡터 이미지로 고정 값이 아니 수치화를 이용한 이미지이기 때문에 크기가 변해도 이미지가 손상되지 않는다는 특징이 있다. 2) 이미지 경로의 예시 상대경로 현재 html 파일을 기준으로 한 경로 절대 경로 웹 서버의 루트를 기준으로 하는 경로 url 다른 외부 서버의 이미지 경로 via.placeholder.com를 이용해 특정 크기.. [웹프로그래밍 실습] 3. HTML 기본태그 2-1. 제목과 문단 태그 활용 example 2-1 html example hello world hello world hello world hello world hello world hello world 2-2. 텍스트 관련 태그 활용 bold text strong text italic text emphasized text mark text small text deleted text inserted text This is superscript text This is subscript text 2-3. 목록 만들기 Unordered List Coffee Tea Milk Ordered List Coffee Tea Milk 2-4. 하이퍼 링크 활용 Naver 2-5. 책갈피 구현하기 Menu Coffee .. 이전 1 2 3 다음
