IT Study/HTML & CSS23 CSS - 스타일 적용방법 & 선택자 CSS(Cascading Style Sheets) HTML 문서를 시각적으로 꾸며주는 역할을 하는 언어 웹페이지의 디자인을 담당 CSS 문법 선택자{ 속성명 : 속성값; 속성명2 : 속성값2; ... } ex) p { text - align : center; color : blue; } >> p 태그를 선택해서 가운데 정렬하고 글자는 파란색으로 바꿔라 CSS 적용하는 방법 1. 인라인 스타일 HTML 요소 내부에 style 속성을 사용해서 적용하는 방법 .... >> 해당 요소에만 스타일이 적용 1) Practice 2. 내부 스타일 HTML 문서의 2) Practice 3. 외부 스타일 (가장 많이 사용) 웹 사이트 전체의 스타일을 하나 혹은 최소한의 파일에서 변경이 가능 .. 2022. 12. 29. HTML - 시멘틱 웹 태그 시멘틱 웹 태그 전 세계에 만들어져있는 웹 문서의 갯수가 증가 따라서 정확하고 가치 있는 정보 탐색을 위해 요구하는 사항들이 점점 늘어남 >> 웹 세상에서 방대하게 퍼져있는 웹 문성를 보다 쉽고 정확하게 구분하고 조합하기 위한 시멘틱 웹 태그를 사용하게 되었다. 사용 이유 1) 웹 접근성 장애를 가진 사람과 가지지않은 사람 모두가 웹 사이트를 이용할 수 있게 하는 방식을 가리킨다. 2) 검색엔진 검색엔진의 자체 알고리즘이 키워드를 추출하는데 이 때 해당 알고리즘이 시멘틱 태그를 읽어 더욱 정확한 내용을 전달하여 검색 엔진 상위 문서에 노출될 수 있도록 해줌 3)가독성 시멘틱 웹 태그의 종류 1) header 웹 사이트의 제목, 로고, 검색 폼, 작성자 이름 등의 요소등을 담는 태그 2).. 2022. 12. 29. HTML - 태그 종류2 1. 태그 (책갈피) lorem + 엔터 >> 하얀 글씨 구조 시각화될 단어 ..... 2022. 12. 29. HTML - 태그종류 1. HTML 파일 확장자명은 파일명.html 2. ! + 엔터(VSCode 기준) >HTML 문서 구조 출력 //번역 //위치나 높이 조절 Document // 제목 1. meta 태그 meta 태그는 태그에 정보를 추가하기 위한 태그 2. 2022. 12. 29. HTML - FrontEnd 프론트 엔드 사용자 입장에서 불편함이 없도록 눈에 보이는 화면을 설계하고 백엔드에서 받아온 데이터를 어떻게 화면에 표출할지 고민하는 과정 백 엔드 회원정보, 상품정보와 같은 데이터들을 어떻게 저장하고 관리할지와 어떤 로직을 구성해야 사용자들에게 보다 빠른 속도로 데이터 전달이 가능할지 표현하는 과정 UI(User Interface) 사용자 레이아웃(화면) 사용자가 제품을 사용할 때 마주하게 되는 면( 폰트, 컬러, 레이아웃) UX(User Experience) 사용자 경험(행위) 사용자가 제품을 직간접적으로 사용하면서 얻는 만족감 ex) 검색창 입력, 버튼은 UI, 검색 버튼을 누르는 행위 UX 라고 할 수 있음 즉, UI/UX를 고려하여 웹 사이트를 만든다는 것은 웹 화면 보고 사용자가 .. 2022. 12. 29. 이전 1 2 3 다음
