Notice
Recent Posts
Recent Comments
Link
반응형
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- 객체의 밸류값만 찾기
- 시퀄 문법
- ...점점점문법
- 우분투 시간 변경
- ${변수}
- Robo3T 폰트 키우기
- Robo3T 글씨체 변경
- @Moditying @Query
- 객체를 배열로
- 5.3.8 Modifying Queries
- 깃 토큰 만료
- 스프링 데이타 JPA
- 레디스 확인
- 배열을 객체로
- 리엑트블로거
- search()
- Robo3T 폰트변경
- sql like연산자
- 객체의키값만 찾기
- 코딩 어?
- findIndex()
- Robo3T 글씨키우기
- 문자열 인터폴레이션
- 프론트엔드 스쿨
- indexOf()
- 가상컴퓨터마법사
- js 문자열을 문자배열로
- lastIndexOf()
- ubuntu타임존
- sql 문자열 패턴 검색
Archives
- Today
- Total
코딩기록
css) a태그border 설정시 border가 짧은 이유? a태그 링크 범위 늘리기-display: block; / a태그 영역넓히기 본문
프론트
css) a태그border 설정시 border가 짧은 이유? a태그 링크 범위 늘리기-display: block; / a태그 영역넓히기
뽀짝코딩 2024. 8. 28. 13:42728x90
a태그안에 img를 넣고 a태그에 border를 주는데 아래 그림처럼
[html]
<a >
< img src="~~" />
<span aria-label="버튼을 누르세요"> </span>
</a>
[css]
a {
border: 1px; solid blue;
a, 앵커태그가 생각보다 짧다
그이유는?
[css]
a {
display: block;
border: 1px; solid blue;
a태그의 기본 display 속성 때문이다.
display: block;
설정후 다시 확인하면
border 가 제대로 보인다.
또 이렇게 해야 span태그도 제대로 포함시킬수 있다.
반응형
'프론트' 카테고리의 다른 글
css) 텍스트가 화면에는 안 보이고 스크린리더만 읽게 하는 방법 / 안 보이고 스크린리더도 읽을 수 없게/ 보이고읽을수없게 + 이미지 텍스트 겹칠때 /웹접근성 (1) | 2024.08.28 |
---|---|
css) aria-label 가상요소로 텍스트 넣기 (0) | 2024.08.28 |
js) 자주 쓰는 js 문법 모음 / 배열안 객체 관련 문법 모음 (0) | 2024.08.23 |
DOM, html에서 script 태그 작성 위치와 DOM (0) | 2024.07.08 |
JS) 객체지만 배열처럼 사용가능한 유사배열을 배열로 바꾸는 .from() (0) | 2024.07.06 |
Comments