본문 바로가기

Front7

PM1 https://www.figma.com/file/VlVbetv3fuSDQ8CFND0fE7/%EC%84%B8%EB%AF%B8%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-%EC%B4%88%EC%95%88?node-id=0%3A1&t=ILTSifQ5k2PHSRli-0 메뉴 개선할 점 1) 기능 수정 및 추가 2) 상/ 하위 메뉴 설정 3) .photo 이미지 잘리는 지점 정리 지금 상태 코드 About Menu Store PetMeeting Personal About Menu Store PetMeeting Personal START P.M. body{ margin: 0px; width: 2000px; } nav a { text-decoration: none; color: black; ma.. 2023. 1. 25.
HTML개요 HTML (HyperText Markup Language) :하이퍼 텍스트와 콘텐츠를 표시해주는 언어 Hyper Text : 하이퍼링크를 통해 어떤 문서에서 다른 문서로 접근할 수 있는 텍스트 Markeup : 콘텐츠를 표시한다는 뜻 Language : 언어 rendering : HTML코드가 웹브라우저를 통해 해석되고 표현되는 과정 HTML의 확장자 : '.html', '.htm' 파일 수정은 텍스트 편집기로 열고 결과(웹페이지)를 확인하려면 웹브라우저로 연다. 개발자도구 이용하기 Mac 단축키 개발자도구 열기 : Command + Option + j 코드 에디터 프로그래머가 프로그램 소스 코드를 편집하기 위해 사용하는 소프트웨어이다. 텍스트 자동 완성 + 하이라이팅 기능이 추가된 메모장과 같다. 추천.. 2023. 1. 19.
하리보 전시 입구 사진 HTML, 구현 실습중 HRIBBO macht kinfer froh und Erwachense ebenso! 하리보는 아이들을 즐겁게 해요. 그리고 어른들도! 함께해요 모두 다, 행복해요 하리보! 따라할 사진 @import url('https://fonts.googleapis.com/css2?family=Jua&display=swap'); #text3 { font-family: 'Jua', sans-serif; } 그런데 웹폰트 적용이 프리뷰에서는 보이지만 브라우저로 열었을 때는 적용되지 않고 보인다. 뭐지..? 2023. 1. 11.
CSS3 1. CSS3(Cascading Style Sheets 3) HTML5와 함께 웹 표준의 하나로 미리 약속된 스타일 속성을 통해 레이아웃과 스타일을 정의한다. 문서 내용과 스타일을 분리하여 내용을 수정해도 디자인을 바꿀 필요가 없고 디자인을 수정해도 글 내용을 바꿀 필요가 없다. 선택자 { 스타일 속성: 속성 값; 스타일 속성: 속성 값; ... } 2. 스타일 시트 웹 문서에서 안에서 사용되는 스타일들을 모아 놓은 것을 스타일 시트라고 한다. 2.1. 내부 스타일 시트 웹 문서 안에서 사용할 스타일을 태그 내부에 작성하는 방법이다. 이때 태그는 2.2. 외부 스타일 시트 스타일을 별도의 파일에 작성해 놓는 방법이다. (파일 확장자는 css이다.) 웹 문서에서 필요할 때마다 태그를 이용하여 외부 스타일 .. 2023. 1. 5.
HTML5 type & tags 태그의 기초 태그의 사용법 : 기호를 사용해서 콘텐츠의 시작과 끝을 표시한다. 각 태그는 콘텐츠를 감싸며, 태그명은 콘텐트의 성격과 의미를 나타낸다. 단일 태그 : 경우에 따라서는 시작과 끝을 구분할 필요가 없다. 여는 태그나 닫는 태그 중 어떤 것을 써도 상관 없는 경우에 해당한다. 속성 태그 : 태그의 부가적인 기능을 정의한다. (선택사항) 태그명과 속성 정의는 공백으로 구분하며 큰따옴표를 사용한다. 주석 : 컴퓨터는 읽지 않고 사람에게만 보이게 처리할 때 사용한다. HTML 구성요소 : 이것이 html 최신 표준 문법으로 작성되었음을 나타낸다. : 웹 브라우저 화면에는 보이지 않지만 웹 브라우저가 알아야 할 정보들은 모두 이 태그에 들어간다. : 문자 인코딩 및 문서 키워드 등에 대한 요약 정보를 .. 2023. 1. 5.
HTML5 태그2 230104 영역 관련 태그 1. 블록 레벨 태그 - 사각형이 한 행 전체를 차지(너비100%) - 블록레벨은 무조건 한 행을 차지하니까 다른 요소가 함께 같은 줄에 올 수 없음 예) div, p, pre, hr, table ... 2. 인라인 레벨 요소 태그 - 내용에 해당되는 부분만 영역을 지님 - 다른 요소와 함께 사용 가능 예) span, img, input, button ... VS - (블록 레벨 태그)화면 분할 - 콘텐츠가 없으면 높이0, 너비 100%차지 - (인라인 레벨 태그) 콘텐츠를 감싸는 역할 - 컨텐츠가 없으면 높이, 너비 모두 0 3. iframe 태그(인라인 프레임) - 웹 문서 안에 다른 웹 페이지 추가 src= "페이지 경로 추가" 3-1. [상대 경로 방식] : 현재 파일.. 2023. 1. 4.