[HTML] 배경이미지 한번 반복하기 > ⓘ 웹

본문 바로가기
사이트 내 전체검색


회원로그인

ⓘ 웹

[HTML] 배경이미지 한번 반복하기

페이지 정보

작성자 SDJ 작성일17-05-21 00:45 조회2,849회 댓글0건

본문

 글쓴이 : Jin (121.137.222.51)     날짜 : 08-01-16 15:53     조회 : 7700    

 


<style type="text/css">
<!--
body {
 background-attachment: scroll;
 background-color: #000000;
 background-image: url((배경이미지경로/파일명.gif));
 background-repeat: no-repeat;
 background-position: left center;   
}
-->
</style>

위 내용에 대해 간략하게 설명드리면
background-attachment: scroll; 이부분은 배경까지 같이 스크롤 되게 하는 옵션입니다..만약 배경 화면을 그대로 고정하시고자 한다면
fixed로 지정해주면 되구여..
background-color: #000000; 이부분은 배경색상을 지정해주는 부분입니다.
background-image: url((배경이미지경로/파일명.gif));  배경으로 사용할 이미지를 지정하는 부분입니다.
background-repeat: no-repeat;  이부분은 원하시던 기능인 배경을 반복시키지 않고 한번만 나오게 하는 기능입니다.
만약 가로로만 반복하게 하고자 한다면 repeat-x 세로로만 반복하게 하고자 한다면 repeat-y 전체 반복은 repeat 로 주시면 됩니다.
background-position: left center;    이부분은 배경을 고정했을때 어느 위치에 나오게 할것인지를 지정하는 부분입니다..
첫번째 left는 가로 정렬을 말하는거고 두번째 center는 세로 정렬을 말합니다.. 각각의 옵션은

가로일때는 (left, center, right)가 있고 세로일때는 top, center, bottom이 있습니다..



 

<ex>


<style>
.body {
 background-attachment: scroll;
 background-color: #ffffff;
 background-image: url(lab2.jpg);
 background-repeat: no-repeat;
 background-position: left top;   
}
</style>
<html>
<head>
<title>예진이닷컴 ♡ YeJin2.com</title>
</head>
<body class=body>
<p align="right">
<br>
<a href="http://yejin2.com" target="_top">YeJin2.com</a>
<br>
2007.04.17~
<br>
<br>


 

 

 

 

 

 

 

댓글목록

등록된 댓글이 없습니다.

ⓘ 웹 목록

Total 23건 1 페이지
ⓘ 웹 목록
번호 제목 글쓴이 날짜 조회
23 인터넷 속도 측정 사이트 (무설치/로그인 필요없음) fast.com 인기글관련링크 SDJ 12-13 1171
22 로고 관련 인기글관련링크 SDJ 03-26 1385
21 타임라인 400 에러 인기글관련링크 SDJ 02-22 2295
20 유투브 다운로더 (프로그램) 4K Video Downloader외 (오류 해결) 인기글관련링크 SDJ 05-21 7062
19 N스토어 무료 영화관 / 네이버 / 영화 무료 다운로드 인기글관련링크 SDJ 05-21 2543
18 네이버 메일 발송 실패 안내 / exe 첨부 / Message was blocked as some attac… 인기글관련링크 SDJ 05-21 2745
17 WayBackmachine : 웹사이트 옛모습 확인 인기글관련링크 SDJ 05-21 1826
16 포털 사이트 (역사) 인기글 SDJ 05-21 2641
15 (정리 필요) 도메인 국가 코드 / 코드순 / 국호순 인기글관련링크 SDJ 05-21 3424
14 포토샵 필요할때 간단히... http://apps.pixlr.com/editor/ 인기글관련링크 SDJ 05-21 2960
13 주의. 인터넷 속도 측정 사이트 (무설치/로그인 필요없음) speedtest.net 인기글관련링크 SDJ 05-21 4119
12 ss : youtube 동영상 다운로드 (주소 방식) 인기글 SDJ 05-21 2093
11 웹에서 한자(간자)가 깨져보일때 인기글관련링크 SDJ 05-21 2391
10 고화질 티비 웹으로 지상파외 시청 인기글관련링크 SDJ 05-21 5385
9 스팸 전화번호 검색 : 전화번호를 입력하면 스팸여부등을 확인 인기글관련링크 SDJ 05-21 2224
8 그누보드 탈퇴 / 회원삭제 인기글 SDJ 05-21 4242
7 기상청의 도시별 기상 정보를 담고있는 xml 인기글관련링크 SDJ 05-21 3165
6 파비콘(웹사이트 아이콘) 적용하기 인기글 SDJ 05-21 2833
5 웹페이지 한번에 블럭잡는 방법 인기글관련링크 SDJ 05-21 2292
4 요긴한 사이트 모음 인기글관련링크 SDJ 05-21 2611
3 이미지gif 배경을 깨끗하게 없애기 인기글관련링크 SDJ 05-21 2961
2 플래쉬에서 이미지가 깨끗하게 나오지 않을때.. 인기글관련링크 SDJ 05-21 2732
열람중 [HTML] 배경이미지 한번 반복하기 인기글 SDJ 05-21 2850
0 퓨니코드 (한글.com -> xn-- ) 인기글 SDJ 05-21 3137
-1 동영상 태그 인기글 SDJ 05-21 2194
-2 게임관련 웹사이트 인기글 SDJ 05-21 2457
-3 그누 긴글 쓰기 관련 인기글 SDJ 05-18 3002
게시물 검색

접속자집계

오늘
249
어제
371
최대
1,010
전체
425,977
회사소개 개인정보취급방침 서비스이용약관 Copyright © sdj.kr All rights reserved.
상단으로
모바일 버전으로 보기