Responsive website

css
bootstrap
html

(Phạm Thành đô) #1

Các bác giúp em với ạ. Giao diện chỉ hiển thị với điện thoại, còn hiển thị với máy tính ạ. Em vẫn không tìm ra lỗi:
HTML:

<div id="head-background">
	<img id="head-image" src="assets/images/ava_Do.png" alt="Placeholder">
</div>

CSS:

@media all and (min-width: 320px) {
  #head-background {
    height: 15%;
    position: relative;
    background-image: url(../assets/images/image.png);
    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 0;
  }
  #head-image {
    border-radius: 50%;
    left: 15%;
    max-width: 250px;
    position: absolute;
    top: 110%;
    transform: translateY(-75%);
    z-index: 1;
  }
}

@media all and (min-width: 768px) {
  #head-background {
  height: 35%;
  position: relative;
  background-image: url(../assets/images/image.png);
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 0;
  }

  #head-image {
    border-radius: 50%;
    left: 15%;
    max-width: 250px;
    position: absolute;
    top: 135%;
    transform: translateY(-75%);
    z-index: 1;
  }
}

Em cảm ơn các bác.


(anhpv) #2

clear cache web browser xem


83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?