전체 글(122)
-
[HTML/CSS] 체크박스 커스텀
HTML CSS input[type="checkbox"] { appearance: none; width: 26px; height: 26px; background: url(../../images/common/check_default.png) no-repeat; cursor: pointer; } input[type="checkbox"]:checked { background-image: url(../../images/common/check_checked.png); }
2023.11.29 -
[웹접근성] 적절한 대체 텍스트 제공
오류사례 1. 텍스트 이미지에 대체 텍스트가 제공되지 않은 경우 오류사례2. 불충분한 대체 텍스트를 제공한 경우 오류사례3. 대체텍스트가 오타로 표기된 경우 Home > 사이트맵 Home > 사이트맵 오류사례4. 이미지 버튼에 대체 텍스트를 제공하지 않은 경우 오류사례5. 불릿 이미지에 대한 대체 텍스트를 제공하지 않은 경우 2012년 함께 누리는 일자리 한마당 2012년 함께 누리는 일자리 한마당 2012년 함께 누리는 일자리 한마당 2012년 함께 누리는 일자리 한마당 2012년 함께 누리는 일자리 한마당 2012년 함께 누리는 일자리 한마당 2012년 함께 누리는 일자리 한마당 2012년 함께 누리는 일자리 한마당 오류사례6. 의미 없는 이미지에 대체텍스트를 제공한 경우 오류사례7. longdesc..
2023.11.28 -
[JQuery] 레이어 팝업 띄우기
HTML [필수] 대표자 개인(신용)정보수집·이용·제공·조회 동의 Lorem, ipsum 대표자 개인(신용)정보수집·이용·제공·조회 동의 Lorem ipsum 1. 수집·이용에 관한 사항 • 수집·이용 목적 기업신용평가 및 사업체 및 사업장 현황조사 • 수집·이용 항목 필수적 정보 개인식별정보: 성명, 주민등록번호, 주소, 연락처 선택적 정보 개인식별정보 외에 고객이 제공한 정보: 자격증, 수상경력 등 ※ 본 동의 이전에 발생한 개인(신용)정보도 포함됩니다. • 보유·이용 기간 • 동의를 거부할 권리 및 동의를 거부할 경우의 불이익 확인 JavaScript function modalPopupOpen(object) { $(object).show(); } function modalPopupClose(obje..
2023.11.26 -
[HTML/CSS] Flex
flex는 컨테이너가 차지하는 공간에 맞추기 위해 크기를 키우거나 줄이는 방법을 설정하기 위해 사용한다. 컨테이너에 사용할 수 있는 속성은 flex-direction, justify-content, align-items가 있으며 flex-item에 사용할 수 있는 속성은 flex-grow, flex-shrink,flex-basis가 있다. flex-item에 부여할 수 있는 속성은 축약형으로 사용할 수 있는데, 다음과 같다. A B C #flex-container { display: flex; border:1px solid black; padding:10px; width: 500px; height: 100px; flex-direction: row; justify-content: space-between;..
2023.11.22 -
[HTML/CSS] 반응형 테이블 만들기
1. PC HTML 선택 이름 홍길동 나이 20세 출생지 서울 상세보기 보기 CSS table.type3 { border-spacing: 0; border-collapse: collapse; width: 100%; margin-bottom: 40px; } table.type3 tr { border: 1px solid #000; } table.type3 th, table.type3 td { text-align: center; padding: 5px 0px; } table.type3 th { background: #000; color: #fff; } 2. Moblie @media (max-width:600px) { table.type3 colgroup { display: none; } table.type3 ..
2023.09.29 -
[HTML/CSS] 툴팁 만들기
간단한 툴팁 HTML
2023.06.25