전체 글37 HTML 필수 태그 : 텍스트, 그룹, 목록, 링크, 이미지, 텍스트 강조 텍스트 관련 태그 hn 태그 제목이나 주제와 같은 성격의 텍스트를 작성할 때 사용 h1 - h6 (⭐️ 중요도에 따라 구분) 블록 요소 실무에서는 상대적으로 h1 - h4 태그까지 자주 사용 hn 태그로 작성된 텍스트는 검색 엔진에서 키워드로 인식 (검색 엔진 최적화를 위해서 본문의 핵심이 되는 제목이나 주제를 잘 선택해서 작성해야함) 보통 하나의 HTML 확장자 파일 안에서는 h1 태그는 한 번만 사용하는 것을 권장 p 태그 단락(문단, 문장)을 구성할 때 사용 블록 요소 br 태그 줄바꿈을 할 때 사용 콘텐츠가 없는 문법 blockquote 태그 인용문을 작성할 때 사용 문장, 문단 단위로 긴 내용을 인용할 때 블록 요소 ➕ cite 속성 사용 가능 (cite="출처 URL") q 태그 문장 단위의 .. 2023. 11. 22. HTML에서 주석을 조심해서 써야하는 이유 코드에 주석으로 작성하고 👀 Live Server로 웹 브라우저를 보면 아무것도 표시되지 않는다하지만개발자 도구나 검사 혹은 ⚒️ 개발자 도구 열기 : (mac 기준) option + command + I페이지 소스 보기 페이지에서는주석 내용을 모두 볼 수 있다그러니 반드시주석에는 보안상 중요한 내용을 넣으면 안된다 ❌ 2023. 11. 21. HTML 기본 구조 알아보기 나의 첫 번째 웹 페이지! DTD 문서형 정리 HTML5 문서 형식으로 해석 html 태그 HTML 문서의 시작과 끝 모든 태그는 html 태그 안에 콘테츠로서 작성해야함 head 태그 문서 정보 정의 즉, HTML 문서의 메타데이터 정의 영역 웹 브라우저 직접 노출 ❌ meta, title, link 등 문자열, 문서 제목, CSS, 자바스크립트 참조 경로 등을 정의 (⭐️ 메타데이터 : HTML 문서에 대한 정보) 👀 viewport 👀 반응형 웹페이지에서는 필수 ✨ title 태그 ✨ 생략 불가능 반드시 1개 중복되지 않도록 주의 title 태그를 사용하지 않았을 경우, 웹브라우저는 해당 HTML문서를 웹페이지로 인식하지 않음 2023. 11. 21. 프리코스 후기 추후 업데이트 됩니다 2023. 11. 20. 도움이 되는 VSCode 확장 프로그램 추천 Auto Rename Tag 한 쪽 태그를 수정하면 나머지 크로스 태크도 같이 수정된다. 코드가 길어져서 크로스 태그를 찾기 힘들 때, 유용하게 사용할 수 있다. HTML to CSS autocompletion HTML 문서에 class 속성으로 red라는 클래스를 지정했을 때, css 파일에서 r 한 글자만 작성하여도 자동완성이 지원된다. 🚨 HTML 문서 작성 후 저장은 필수!! 🚨 CSS Peek index.html 파일에서 내가 찾아가고 싶은 클래스 이름에 window는 ctrl 키 mac은 command 키 를 누르면서 해당 클래스를 클릭하면 바로 클래스의 CSS 파일으로 이동된다. Autoprefixer Autoprefier은 CSS3의 벤더 프리픽스를 자동으로 붙여준다. 일부 CSS3 속성들.. 2023. 11. 20. [CHALLENGE] NFTPARK ⭐️ 2023년 1월 25일 ELLIE TOUR WORLD에 작성되었습니다 ⭐️ 2023년 11월 18일 ELLIE PROGRAMMING WORLD 로 옮김 [Challenge] WEB2와 WEB3가 결합된 NFT 티켓팅 B2C 플랫폼 2023년 1월 10일 - 2023년 1월 25일 기획 의도 B2C 티켓팅 사이트 인터파크(INTERPARK)에 NFT 기술을 결합하여 사회적으로 대두되는 "암표거래" 문제를 해결하는 것이 이 프로젝트의 핵심 목표이다. Use Stack 주요 기능 커뮤니티 유저가 티켓 구매 응모에 참여 티켓 구매 당첨자 추첨 티켓 취소(환불) 및 소각 마켓플레이스에서 원가보다 낮은 가격으로만 거래(OnSale) 화이트리스트 판매 페이지별 기능 SignUp / Login - 카카오톡 간편 .. 2023. 11. 18. [PROJECT3] Advertisement For You ⭐️ 2022년 12월 7일 ELLIE TOUR WORLD에 작성되었습니다 ⭐️ 2023년 11월 18일 ELLIE PROGRAMMING WORLD 로 옮김 [Project3] 블록체인 자동 중개플랫폼 2022년 11월 10일 - 2022년 12월 07일 기획 의도 블록체인 다중서명 계약 및 SBT토큰을 활용하여 중개자 없이도 신뢰도 있는 계약을 진행할 수있는 유튜버 광고 중개 플랫폼이다. Use Stack 주요 기능 MainPage - Google OAuth를 이용한 간편 회원가입 - 로그인 - 광고, 광고주, 크리에이터 간단한 정보 ListPage - 광고, 광고주, 크리에이터 전체목록 확인 - filter기능으로 검색 - 광고, 광고주, 크리에이터 카드 선택으로 상세페이지로 이동 광고주 MyPage.. 2023. 11. 18. [PROJECT2] Incentive Community 만들기 : TAKO ⭐️ 2022년 11월 9일 ELLIE TOUR WORLD에 작성되었습니다 ⭐️ 2023년 11월 18일 ELLIE PROGRAMMING WORLD 로 옮김 [Clone Coding] Incentive Community 구현 2022년 10월 27일 - 2022년 11월 09일 기획 의도 여행을 좋아하는 사람들이 모여 정보와 여행 일상을 공유할 수 있는 투어리스트 커뮤니티 웹사이트를 개발하였다. 투어리스트들은 게시글과 댓글을 작성을 통해 토큰(TAKO)을 보상받을 수 있고 이후 모은 토큰을 사용하여 나만의 NFT를 발행할 수 있다. Use Stack 주요 기능 SignUp / Login - 회원가입 / 로그인 MainPage - 게시글 전체 목록 보기 - 테마별 게시글 모아 보기 - 댓글 쓰기 삭제 - .. 2023. 11. 18. [PROJECT1] NFT 애플리케이션 구현 : 오픈씨 클론코딩 ⭐️ 2022년 10월 26일 ELLIE TOUR WORLD에 작성되었습니다 ⭐️ 2023년 11월 18일 ELLIE PROGRAMMING WORLD 로 옮김 [Clone Coding] OpenSea : NFT 거래소 구현 2022년 10월 19일 - 2022년 10월 26일 Flow Chart WireFrame 구현 회고 나에게 다가올 미래를 모르고 해맑았다. 벌써?? 기획 OK!! 우아!! 재미있다!! 이대로면 우리 완성할 수 있겠는걸?!?! 에러 정리도하고... 플로우 차트도 정리하고... 잠도 잘자고... 앗!! 뭐야뭐야?? 우리 생각보다 잘하잖아?? 여유있게 아이콘 쇼핑, 로고 이미지 만들기, Nav, Footer, 지갑까지 구현!! FontAwesome 공부 프론트엔드!! 열심히 페이지 제작!.. 2023. 11. 18. 이전 1 2 3 4 5 다음 반응형