web동곤

1)@media 태그2) bootstrap (css프레임워크) 1) @media 태그     @media : 화면에크기별로 다른 css 적용이가능함 @media태그 예제 화면의 크기 별로 바탕색이 달라져요  2)bootstrap  css를 매번 처음부터만드는것도 쉽지않다그것을 해결할 수 있는 방법중 하나가 부트스트랩(bootstrap)이다사용가능한 두개의 사이트를 보여주겠다 https://www.w3schools.com/bootstrap5/bootstrap_flex.php W3Schools.comW3Schools offers free online tutorials, references and exercises in all the major languages of the web. Cover..

1) 레이아웃 스타일1-1)블럭요소라인1-2) position1-3) z-index1-4) visibility 1-5)float1-6) 배치1-7) 실습1-8) 순서선택자+실습1-9) flex 관련 실습 , \1-10) 시맨틱태그 예제1-11) 예제21-12) 로그인 예제1-13)세부사항 예제1-14) 통합 예제  1)레이아웃 스타일 .size-test{ border: 10px solid red; } #test1{ width: 400px; /*가로*/ height: 200px;/*높이*/ } #test2{ width: 50%; /*창의크기에 따라 가로길이가 ..

1) 선택자1-1)전체선택자1-2)태그선택자1-3)아이디선택자1-4)클래스선택자 2)기타 선택자2-1) 속성 선택자2-2) 자손선택 후손선택2-3)동위(같은레벨)선택자2-4) 반응선택자2-5) 상태선택자  3) 선택자 우선순위4)폰트 스타일5)text 스타일6)list 스타일7)영역관련 스타일8)테두리(border)관련 스타일9)배경관련 스타일10) 예제   1) 선택자 선택자란? 특정 html 요소를 선택하고자 할 때 사용하는기능        선택자로 해당요소를 선택하면 원하는 "스타일"과"기능" 적용가능(style은 head내에 적어줘야함 (그게아니라면 모두 inline요소로 작성해야함) 1-1. 전체선택자(모두)    * {         스타일속성:값;         스타일속성:값;     }1-..

1) 영역관련태그 2) 하이퍼링크 태그 3) 폼/이미지 태그  1) 이미지태그  2 form 4) CSS4-1) CSS 기본형식4-2) css 작성방식4-3 ) font_css4-4) CDN , fontawsesome 5) 아이디 클래스 선택자   1) 영역관련태그 1) HTML4의미없는 태그(,)으로만 구역을 나눴음2) Block 요소(한줄 차지)로 동작좌우 공간을 모두 차지하고 페이지를 수직으로 분할주로 전체 영역이나 큰 덩어리의 콘텐츠를 나눌 때 사용43) inline 요소(콘텐츠의 크기만큼 차지)로 동작콘텐츠의 크기만큼만 공간 차지, 웹 페이지를 수평으로 분할주로 짧은 텍스트나 특정 단어를 묶을 때 사용 콘텐츠1 콘텐츠2 콘텐츠3 콘텐츠4 ..

1) HTML 개요 및 설정\2) visual studio 설치3) HTML 파일 생성과 기본태그4)글자관련태그5) 목록관련태그6) 표관련테그 1) HTML 개요 및 설정웹(WEB)인터넷에 연결된 컴퓨터를 통해 사람들이 정보를 공유할 수 있는 공간 인터넷의 통신망 위에서 작동하는 서비스웹 처리 과정네트워크를 통해 서로 연결된 컴퓨터들 간에 서버와 클라이언트의 역할을 나누고 HTML이라는 마크업(Markup) 언어를 통해 자료를 주고 받음 관계도웹 특징HTTP(Hyper Text Transfer Protocol) 사용 HTML(Hyper Text Markup Language)로 작성된 문서 연결 텍스트, 그래픽, 오디오, 비디오, 프로그램 파일 등 멀티미디어 서비스 제공반응형 웹웹 서버에서 제공되는 정보가..