본문 바로가기

HTML & CSS8

[HTML&CSS]img 태그 src가 없을때 기본 이미지 표시하기 img 태그 안에 onerror="this.src='default 이미지 주소' "를 추가하면 된다. onerror='주소'만 추가해도 된다고 하지만, 이상하게도 적용되지 않았다. 혹시 저처럼 안되는 경우에 this.src=''를 사용해보기를 바란다. 1 cs 2023. 3. 5.
[CSS]IMG를 수직 중앙 정렬 시키기 wrapper에 line-height 값을 지정하고 img에 vertical-align:middle; 을 지정한다. 예시 : .press-img-wrapper { position: relative; width: 200px; height: 200px; line-height: 200px; } .press-img { width: 100%; vertical-align:middle; margin: 0; } 2023. 2. 17.
img 태그 width 값과 화질에 대한 아주 짧은 분석 이미지 순서대로 (1) 원본(width 205px)의 이미지를 width="105" 설정 (2) 원본(width 105px)의 이미지를 width="105" 설정 (3) 원본(width 105px)에 width 값 옵션 없이 설정 1. 원본 105px 이미지를 그냥 표시하는 것과 width="105px" 지정하는 것은 차이 없음 2. Duolac BI의 경우 205px을 105px로 줄인 이미지 보다 105px로 줄인 이미지 화질이 선명함 3. Lactoclear의 경우 반대로 205px을 줄인 이미지가 더 선명한 느낌 경험상 이미지는 width 값 변경없이 표시하는게 왜곡 없이 깔끔하나, (Duolac) 그렇다고 큰 원본 이미지를 포토샵 등에서 줄일 경우 왜곡이 발생할 여지가 있음 (Lactoclear) 2023. 1. 13.
[오류 기록용] 메일 서명 생성툴 CSS 차이 발생 건 1) 미리보기에서 보이는 BI 이미지 줄간격은 이상이 없었으나, 웹메일에 HTML 코드 붙여넣기하면 간격이 너무 벌어짐 -> 태그 내에 margin: 0; padding: 0; 입력 및 기타 수치 기입 2) 신규 그룹웨어에 HTML 코드 붙여넣기 시 지나치게 크게 나옴 또한 네이버에서 메일 수신하면 서명이 지나치게 크게 나옴 -> em으로 된 값을 pt / px 로 수정 3) 그 밖에 원하는 위치보다 ci가 더 위에 표시되어 한참 애먹었는데.. 위에 추가하여 해결됨..^^ 후.. 고생했다! 2023. 1. 11.