본문 바로가기

🦁 멋쟁이사자처럼9

[220927] SVG와 Sass를 배웠다. 그런데 왜인지 집중이 잘 안되는 날이었다... (정신차려 갬맹재,,,!) 그래서 SVG만 우선 간단하게 정리했다. SVG(Scalable Vector Graphics)란? - 확장 가능한 벡터 그래픽이란 뜻으로, XML 기반의 2차원 그래픽이다. - 이미지 파일 형식(Image file format) 중 하나이다. - HTML 태그의 집합으로 이루어져 있기때문에 css와 javascript로 컨트롤이 가능하다. - HTML과 텍스트의 관계를 그래픽에 적용한 것으로, 점과 선을 이용해 텍스트를 이미지처럼 사용한다. - 벡터 그래픽을 이용하는 대표적인 응용프로그램 중에는 어도비 일러스트가 있다. 장점 - 확대/축소를 해도 해상도가 깨지지 않고, 화질이 유지되며 용량 또한 늘어나지 않는다. - 용량이 PNG,.. 2022. 9. 27.
[220908] CSS 종합적으로 배웠는디 📘 Reset CSS 많은 브라우저들의 기본 스타일 제각각이다. 이럴 때 브라우저의 기본 스타일을 리셋하고 작업하면 좋다. 에릭마이어의 CSS(https://meyerweb.com/eric/tools/css/reset/) 수업시간엔 이걸로 사용 브라우저의 모든 기본적인 스타일 속성들을 완전히 초기화 모든 스타일을 처음부터 만들도록 합니다. reset.css 코드를 그대로 사용할 수도 있고, 여기에 프로젝트만을 위한 커스텀 스타일을 추가해서 사용하기도 합니다. 2011 이후로 업데이트 중단됨 nomalize CSS 브라우저 고유의 스타일을 존중 코드에 대한 설명과 이유과 잘 적혀있음 📘 box-sizing 속성 개인적으로 CSS style reset 할 때, box-sizing: border-box를 쓰면.. 2022. 9. 8.
[220907] form의 속성과 전송방식 등 ✏️ 요소는 뭐에 쓰는 거지? 어떻게 동작하지? - 폼은 정보를 입력하는 영역(로그인, 회원가입, 게시판 등등) - 폼에 입력을 하고 제출(submit)하게 되면 → 데이터는 서버로 전송 → 전송한 데이터는 웹 서버가 처리 → 처리 후 로그인 결과 화면 같은 다른 웹 페이지를 클라이언트에 전송 - 태그여야 서버에 제출이 가능한데, input에 없는 데이터인 경우는 input hidden을 추가해서 데이터를 input에 넣어 제출한다. ✏️ 요소의 action 속성의 전송방식 URL로 데이터를 전달 할거냐 → GET 방식 - 스니핑 할 수 있다(훔쳐보기가 가능하다는 뜻) - URL로 데이터를 전달할 때 사용(file같은 큰 파일은 GET으로 전송하지 않는다. id와 pw같은 민감 데이터X) URL에 데이터.. 2022. 9. 7.
[220905] HTML태그별 사용 용도 / 마크업 시 알아둘 것 ✏️ 오늘 배운 내용 시멘틱 마크업이란? HTML 태그별 사용 용도 HTML 마크업 작업을 할 때 알아둘 것 다음에 배울 내용 📖 시멘틱 마크업(Semantic Markup)이란? - Semantic: 의미론적인 - Markup : HTML 태그로 문서를 작성하는 것 - 시멘틱 마크업이란, HTML 태그들을 문서 내용에 맞게 선택하여 작성하는 것을 말한다. 시멘틱 마크업을 사용해야 하는 이유 SEO : 검색엔진 최적화에 유리하다. 웹접근성 : 시각장애인들도 웹을 편리하게 접할 수있도록 도와준다. 유지보수 : 정리된 마크업은 코드 식별이 용이하다. 웹 에이전트란? 서치 엔진의 데이터베이스를 구축하기 위해 인간(사용자)를 대신하여 정보 자원을 수집, 검색하고 추론하여 다른 에이전트와 상호 정보 교환 등의 일.. 2022. 9. 5.