가상 선택자의 종류 -동적 가상 클래스 -구조적 가상 클래스 1.동적가상클래스 ;사용자가 특정 액션을 발생시키기 위해, 태그의 상태에 따라 css에서 디자인을 넣을 수 있다. :acitve 가상 선택자를 사용할 때는 : (콜론)을 붘여서 사용한다. ----193p 마우스로 태그를 누르고있는 동안 보이는 디자인css을 넣어줄 수 있다. 주로, 누르는 버튼과 관련된 a와 button와 같이 동반사용된다. ex) button:active{ color: lime; } 클릭 :visited 직전에 방문한 링크를 표시 ----194p * action과 함께 동반사용시 visited는 action 위에다가 작성해야함* a:visited { color: purple; } a:active { color: black; }..

192p 가상선택자 (예제파일 챕터11) 1) 동적가상클래스 2)구조적 가상클래스 1) 동적 가상 클래스 ㄱ. active : 클릭시 어떤 기능들이 활성화되는 가상 클래스 -----------------예제파일 1 클릭 button:active 사용시 클릭 body 에 추가로 클릭 그리고 위에 style에 (항상 a:style 등 붙여서 적어야한다) a:active { color: black; } 입력시 링크는 #(없음)으로 했기 때문에, 클릭해도 이동은 안된다. 클릭시 black 으로 변환됨 body 에 추가 클릭 p:active { color: red; } style 추가 시 클릭 클릭 클릭 ㄴ. visited ★ 이미 방문한 링크표시 (ex 링크 누르면 보라색으로 표시되는거) ---- A 태그한테만..

2023.11.28 총정리 1. 만들고 싶은 사이트 모양 구성하기 2. 사이트를 브록단위로 구분하기 (header, section, footer 등) 3. 안에 들어갈 태그 예상해보기(코드 짜면서 수정되는 부분도 있다.) >>앞으로 사이트 완성할 때 까지 가이드 라인이 됨(html과 css배치에 대해서) 4. 코드를 작성하는 순서 1. HTML 내용부터 작성 내용이 없어도 나중에 글이 들어갈 부분은 아무말이나 적어서 작성 (why? 미리 글이 들어갈 위치를 정해두면 css하기 편하다.) 2. CSS 내용 작성 위와 같은 순서로 작성했을 때, 좀 더 css(디자인)에 집중할 수 있다. * HTML 작성할 때 주의할 점 * 1. 크게 분류해서 태그작성(header, section 등) 2.한 영역(ex he..

녹화 준비 : 윈도우 + alt + g 녹화시작 : 윈도우+alt+ R

text-shadow: black 1px 0 10px; 1px 그림자크기 0 번짐정도 10px 그림자 채도 수준 .section1 { display: flex; align-items: center; flex-direction: column; background-image: url(pink.jpg) ; background-size: cover; flex-direction: column; justify-content: center; .section1 { display: flex; align-items: start; /*aline 과 direction이 반대가 되는상황*/ flex-direction: column; /*세로정렬*/ justify-content: center; background-image: u..

요즘 유명한 미드저니. 생성형 AI 요즘 많이 유명합니다. 저는 최대한 많은 ai 프로그램을 습득하는 게 목적입니다. 그럼 제일 첫번 째로 미드저니 부터 익혀봅시다! 미드저니란? 텍스트를 입력하면 AI가 이미지를 생성해주는(Text-to-Image) 모델로, 이미지의 퀄리티가 높은 AI 이미지 제너레이터 입니다. 샌프란시스코에서 만든 인공지능 프로그램 입니다. https://www.midjourney.com/home 디스코드 계정이 없는 사람은 로그인 -> 회원가입 합시다. 그리고 보트형 이미지를 클릭합니다. 그럼, 왼쪽 메뉴에 Newbies 가 보이죠? Newbies에 표시된 곳 아무곳이나 들어가면됩니다! 그리고 명령어 입력방법은 imagine prompt 를 치고, 저기 검은색 칸 안에다가. 이렇게 ..