본문 바로가기

html

(3)
웹 접근성과 HTML/CSS 웹파트 35기 YB 최민입니다 1주차 과제를 하면서 그동안 놓치고 있었던 웹 접근성과 HTML/CSS에 대해 정리해보려고 한다. 🐻 웹 접근성이란?우선 웹 접근성이란 웹 사이트, 도구, 기술이 장애를 가진 사용자들이 사용할 수 있도록 설계 및 개발된 것을 말한다.이는 웹사이트의 내용, 기능, 그리고 디자인이 모든 사용자에게 접근 가능하게 보장하는 것이다. -> 웹은 정보의 주요한 출처로, 접근성이 결여된 경우 특정 사용자 집단은 정보와 서비스에 대한 접근이 제한될 수 있다.  1. 시각적 장애시각장애인 사용자들은 화면 리더기를 사용하여 웹 콘텐츠를 탐색한다. 이들을 위해 텍스트 기반의 대체 정보와 의미론적 HTML 사용이 필수적이라고 한다.-> 예를 들어, 이미지에 대한 설명을 제공하는 대체 텍스트(a..
[CSS] display 속성 - none, inline, block, inline-block 💬 웹 파트 35기 최정완 입니다. 세미나 시간에 display 속성에 대해 배웠는데, 개념이 제대로 잡히지 않아다시 공부해보고자 display 속성을 주제로 포스팅을 하게 되었습니다.CSS에서 display 속성은 요소의 크기를 조정할 때 자주 사용된다.요소가 화면에서 얼마만큼 크기를 차지하고 싶을 지에 대해 고민할 때, display 속성이 자주 사용된다. 이번 포스트에서는 display의 4가지 속성값을 알아보려고 한다.  1. display: none;display: none; 속성값으로 none을 주면 해당 요소가 화면에서 사라진다. 크게 자체도 차지하지 않게 되기 때문에, 화면에서 요소가 안 보이게 만들고 싶을 때 사용할 수 있다. DOCTYPE html>html lang="en">head>..
CSS Flexbox 공부하자고? 너 누군데. 처음 웹 공부를 시작하면 가장 먼저 배우는 HTML과 CSS!그 중에서 프로젝트를 해도 헷갈리는 Flexbox 개념을 정리하려고 한다 💥 CSS Flexbox는 웹 페이지의 레이아웃을 쉽게 만들고 관리할 수 있도록 도와주는 1차원 레이아웃 모델이다.Flexbox를 사용하면 컨테이너 내에서 아이템의 배치, 정렬, 크기 조정을 간편하게 할 수 있다. Flex 속성을 적용하기 위해서는 부모와 자식의 관계가 존재해야 한다.Flex container → 부모flex-direction : 요소 배치 방향 선택 (row (default) / column / row-reverse / column-reverse)flex-wrap : 컨테이너 너비보다 아이템 너비가 클 때 줄바꿈을 결정하는 속성 (nowrap (줄바꿈..