profile__picture 사진 크기 조정
<header class="header">
<nav class="header__content">
<div class="header__buttons">
<a href="index.html" class="header__home">
<img src="assets/icons/logo.svg" alt="logo">
</a>
</div>
<div class="header__search">
<img src="assets/icons/search.svg" alt="search">
<input type="text" placeholder="Search...">
</div>
<div class="header__buttons">
<a href="#none">
<img src="assets/icons/home.svg" alt="home">
</a>
<a href="#none">
<img src="assets/icons/shop.svg" alt="shop">
</a>
<a href="#none">
<img src="assets/icons/messenger.svg" alt="messenger">
</a>
<div class="profile__picture">
<img src="assets/images/avatar.png" alt="user picture">
</div>
</div>
</nav>
</header>.header {
width: 100%;
height: 44px;
background-color: #FFFFFF;
display: flex;
justify-content: center;
position: fixed;
top: 0;
left: 0;
z-index: 2;
border-bottom: 1px solid #DBDBDB;
}
.header__content {
width: 100%;
max-width: 975px;
padding: 0 14px;
display: flex;
justify-content: space-between;
align-items: center;
}
.header__logo {
margin-top: 5px;
}
.header__search {
width: 216px;
height: 28px;
display: none;
align-items: center;
position: relative;
}
@media (min-width: 768px) {
.header__search {
display: flex;
}
}
.header__search img {
width: 12px;
height: 12px;
position: absolute;
top: 8px;
left: 8px;
}
.header__search input {
width: 100%;
height: 100%;
background-color: #FAFAFA;
padding: 4px 10px 4px 28px;
border: 1px solid #DBDBDB;
border-radius: 4px;
outline: none;
font-size: 12px;
/* 폰트 굵기 */
font-weight: 300;
color: #999999;
text-overflow: hidden;
white-space: nowrap;
}
.header__search input:focus {
color: #262626;
}
.header__buttons {
display: flex;
align-items: center;
gap: 16px;
}
.profile__picture img{
width: 24px;
border-radius: 50%;
}css의 .profile__picture부분에서 저는 강의처럼 말고 뒤에 img를 넣어야지만 사진 크기가 조정되는데 img를 안붙혀도 되는 이유가 궁금합니다!
Câu trả lời 1
0
안녕하세요!
general.css에
img {
max-width: 100%
}
이 부분 소스코드가 생략이 된 것 같습니다 !
감사합니다!
header_logo
0
167
1
인스타그램 실습
0
275
1
유튜브 실습
0
305
1
a-button:hover , active에 다음과 같은 에러 메시지가 뜹니다.
0
378
2
도표 자료 (해결)
0
326
1
grid-template-columns에 대하여
0
197
1
flex-shrink 질문입니다
0
215
1
가상 클래스(의사 클래스)의 정의가 이해가 되지 않습니다.
0
221
2
스토리 생성하기 부분에서
0
173
1
안녕하세요 강사님 질문 있습니다.
0
328
1
Abutton 만들기 css가 인식이 안돼요.
0
337
1
유튜브 사이드바 생성할때 bottom 0
0
356
1
영상 자료를 다운받아도 자료가 보이지 않습니다.
0
374
1
인라인 요소, 블록 요소
0
290
1
css 질문 있습니다 !!
0
272
1
자료 pdf 파일로 보내 주실수 있는지 질문드립니다.
0
344
1
nth-child(2n+1)에 대해 궁금해요
0
495
1
개발블로그 내용정리 게시 가능 여부
0
408
1
nth child에 대한 개념
0
407
2
도표자료를 열 수 없습니다.
0
331
1
header태그
0
325
1
<strong>과 같은 semantic 태그와 SEO, 실무의 사용이 궁금합니다!
0
360
1
도표 자료 pdf 파일로 아이패드로 어떻게 옮기나요?
0
1185
1
창이 일정크기 이상 줄어들지 않아요
0
313
1

