본문 바로가기

국비/HTML&CSS5

UI구현_개념 - UI 구현 - WWW(World Wide Web Consortium) W3C는 월드 와이드 웹을 위한 표준을 개발하고 장려하는 국제적인 컨소시엄 조직 웹의 지속적인 성장을 도모하는 프로트콜과 가이드라인을 개발하여 월드 와이드 웹의 모든 잠재력을 이끌어 낸다는 목적 - 웹의 3요소 ① 웹 표준 : 웹에서 사용되는 기술이나 규칙을 의미하며, 웹 사이트를 작성할 때 이용하는 HTML CSS JS 등에 대한 규정과 다른 기종이나 플랫폼에서도 웹페이지가 구현되도록 제작하는 기법 ② 웹 접근성 : 어떠한 사용자, 어떠한 기술 환경에서도 사용자가 전문적인 능력없이 웹 사이트에서 제공하는 모든 정보에 접근할 수 있도록 보장 ③ 웹 호환성 : 서비스 이용자 단말기의 하드웨어 및 소프트웨어 환경이 다른 경우에도 동등한.. 2021. 10. 7.
UI 설계_개념 - UI 설계 1. UI(User Interface) : 사용자가 하드웨어나 시스템에 연결되는 과정에서 사용자의 편리성과 가독성을 높여 주기 위한 것 1) CLI(명령어 라인 인터페이스, Command Line Interface) : 사용자와 시스템이 상호 작용을 하는 방식으로 명령과 출력이 텍스트 형태로 표현 2) GUI(그래픽 유저 인터페이스, Graphical User Interface) : 사용자가 컴퓨터의 자원을 사용할 수 있도록 구성요소들이 그래픽 형태로 표현 3) NUI(자연어 유저 인터페이스, Natural User Interface) : 몸짓, 말소리만으로도 IT 기기를 사용할 수 있는 사용자 인터페이스 2. 소프트웨어 아키텍처(Software Architecture) : 소프트웨어 구성.. 2021. 10. 7.
CSS_flex와 float * 블록레벨의 좌우 배치를 위한 속성 (블록레벨은 지정된 너비 또는 부모의 너비만큼 차지하기 때문에 좌우 배치가 불가능함) 1. flex display의 속성 중 하나인 flex 이용하기 (html5 버전의 기능으로 flex기능 이전에 만들어진 페이지에선 float으로 좌우 배치) 특징 ① container(부모)에 flex를 주면 box(자식)들이 flexable한 배치가 된다. (부모가 flex 값을 가진다.) (좌우 배치 또는 상하 배치) ② flex-direction: row => 좌우 배치 (디폴트) flex-direction: column => 상하 배치 ③ flex-wrap: nowrap => box(자식)들이 container(부모)에 한 줄로 배치된다.(디폴트) box(자식)들의 크기가 .. 2021. 10. 1.
CSS_display * display 속성 종류 : inline, block, inline-block, flex... * css의 display 속성을 이용해 요소들의 표현방법을 바꿀 수 있다.! 1. 인라인(inline) 목록 : , , , , , ... 특징 : 너비, 높이 지정 불가 영역 : 컨텐츠의 크기 2. 블록(block) 목록 : , , , , , , , , 특징 : 너비, 높이 지정가능 영역 : 지정된 너비, 높이 만큼 또는 부모 크기만큼 3. 인라인블록(inline-block) 특징 : 기본적으로 인라인의 속성, 너비와 높이 지정 가능 영역 : 지정된 너비와 높이, 지정 안할시 컨텐츠 크기 - 인라인, 블록, 인라인 블록 예시 인라인레벨입니다. 블록레벨입니다. - > 결과 -> 기본요소들을 display 속.. 2021. 10. 1.
HTML_form FORM 태그 ① ② 데이터로 보낼 입력 양식 ③ 로그인, 회원가입 등 필요한 정보를 적고 제출 버튼을 누르면 백엔드 서버로 전달(로그인 시 필요한 아이디, 비밀번호, 제출버튼을 한 폼으로 지정해서 보냄) - FORM태그의 속성 1. action ① form에 입력된 모든 정보를 보내는 경로 ② action 경로로 정보를 보내기 위해서는 submit이 필요 2. method : form에 입력된 모든 정보를 보내는 방식 1) get 디폴트 보내는 정보가 URL에 노출(보안 취약) 빠르기 때문에 검색용도 2) post 보내는 정보가 body에 포함 보내는 정보가 노출 되지 않음(보안 유지) 느리며 로그인, 회원가입 용도 3. name 태그나 하위태그에서 사용 보낸 정보는 서버 측에서 name 속성으로 식별.. 2021. 9. 28.

티스토리툴바