AD

홍주가 만드는 트게더

a1b2c3d4e5f6g7h8ij
2021-12-19 22:37:44 194 0 2

caaaaa63a9a96cc60a8ea1463a02a5fe.jpg

데스크톱 뷰 ccs에 박고 설정하기 

글 안읽고 설정하기 바로 박을까봐 다시 말하는데 망할 수도 있으니까

설정하기 전 미리 css 코드를 백업해 두시길 바랍니다. <<<<< 중요

참고 사이트

HTML 컬러 코드 (html-color-codes.info)

tgd custom - JSFiddle - Code Playground 

눈누 - 상업용 무료한글폰트 사이트 (noonnu.cc)

상주경천섬체 썼는데 맘에 안들면 님 맘대로 바꾸셈

대신 라이선스 요약표 참조 필수. 폰트 페이지 아래에 있슴

@font-face {

    font-family: 'SANGJUGyeongcheonIsland';

    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/[email protected]/SANGJUGyeongcheonIsland.woff') format('woff');

    font-weight: normal;

    font-style: normal;

}

html {

  background: linear-gradient(to bottom, #E37A01, #910EF0);

  height: auto !important;

}

body {

letter-spacing: -0.05em !important;

background: transparent;

animation: snow 10s linear infinite; 

font-family: 'Nanum Gothic', sans-serif;

}

header #header-bar>.row,

#main .menu-wrapper,

#main #main-content>div.frame {

  box-shadow: 3px 0px 10px rgba(0, 0, 0, 0.2);

}

header #header-bar>.row {

  border-top: 4px solid #FE49F2;

  border-right: none;

  border-bottom: none;

}

header .row>div:nth-child(1)>a {

  display: block;

  width: 145px;

  height: 50px;

  background: url() no-repeat;

  background-size: auto 50px;

}

header .row>div:nth-child(1)>a>img {

  display: block;

    

    filter: grayscale(100%);

  opacity: 0.8;

}

header #right-search-form>input[type='text'] {

  border: 3px solid #FBDA04;

}

#main .menu-wrapper>.header {

  background: #FE49F2;

}

.fa-navicon:before,

.fa-reorder:before,

.fa-bars:before {

  color: white;

}

.fa-square:before {

  color: #FBDA04;

}

header #header-bar>.row,

#main .menu-wrapper,

#main #main-content>div.frame {

  border-right: none;

  border-bottom: none;

}

#main .menu-wrapper {

  border: none;

}

header #right-search-form>#right-search-btn {

  color: #FBDA04;

}

header #header-bar #header-top-notice strong.notice-badge {

  background: #BA71FA;

}

header #header-bar .fa {

  color: #FBDA04;

}

#board-info #board-info-bottom a {

  color: #BA71FA;

}

#main .menu-wrapper>a>em {

  color: #FBDA04;

}

#main .menu-wrapper .spacer {

  background: #FBDA04;

  height: 0.15em;

}

#article-list>.article-list-row>.item>.list-title>.list-writer>span {

  width: 120px !important;

}

#article-list #article-list-category {

  border-top: 2px solid #BA71FA;

  background: white;

}

#article-list #article-list-category>a {

  background: white;

}

#article-list>.article-list-row>.item>.list-header>span {

  background-color: #BA71FA;

}

#article-list>.article-list-row>.item>.list-title>small.comment-count {

  color: #BA71FA;

}

#article-list>.article-list-row>.item>.list-title>.list-writer.logged>span {

  color: #BA71FA;

}

.pagination>.active>a,

.pagination>.active>a:focus,

.pagination>.active>a:hover,

.pagination>.active>span,

.pagination>.active>span:focus,

.pagination>.active>span:hover {

  background-color: #BA71FA;

  border-color: #BA71FA;

}

.pagination>li>a:focus,

.pagination>li>a:hover,

.pagination>li>span:focus,

.pagination>li>span:hover {

  color: #BA71FA;

}

.pagination>li>a,

.pagination>li>span {

  color: #BA71FA;

}

#article-content-wrapper>.header {

  border-top: 2px solid #BA71FA;

}

#article-reply-area #reply-real-area .reply>.reply-header>.reply-writer.logged,

#article-reply-area #reply-best-area .reply>.reply-header>.reply-writer.logged {

  color: #BA71FA;

}

#article-info>h2 {

  font-weight: bold;

}

#article-info>h2>span.category {

  color: #BA71FA !important;

}

#article-reply-area>.header h5 {

  color: #BA71FA;

}

#main .menu-wrapper>a {

  padding: 0.5em 1.4em 0.5em 0.7em !important;

}

a {

  color: #BA71FA;

}

span.a-badge i.fa.fa-info-circle {

  color: #FE49F2;

}

#article-list>.article-list-row {

  border-right: none;

}

#article-list #article-list-menu {

  box-sizing: border-box;

  width: unset;

  margin: 20px;

}

#article-list #boardSearchForm {

  padding-bottom: 20px;

  height: unset;

}

.btn-primary {

  background: #FBDA04 !important;

}

#movetotop img{display:none}

#movetotop {

display: inline-block;

opacity: 1;

background: url(https://yt3.ggpht.com/ytc/AKedOLSC8X8qM5i8gcOYxVYzPxvGCl3RRGONia0L4_EO_A=s176-c-k-c0x00ffffff-no-rj);

width: 120px;


안되면 

#movetotop img{display:none}

#movetotop {

display: inline-block;

opacity: 1;

background: url(https://yt3.ggpht.com/ytc/AKedOLSC8X8qM5i8gcOYxVYzPxvGCl3RRGONia0L4_EO_A=s176-c-k-c0x00ffffff-no-rj);

width: 120px; 지우기


색깔 마음에 안들면 

tgd custom - JSFiddle - Code Playground 가서 

HTML 컬러 코드 (html-color-codes.info) 참고하면서 색깔 정하기

gradientStartColor, gradientEndColor는 배경색깔

두 가지의 색을 다르게 설정하면 위에서부터 아래로 색깔이 그라데이션

FirstColor는 광고 패널색

SecondColor는 트게더 메뉴

ThridColor는 글쓰기, 닉네임 색깔

FourthColor는 트게더 왼쪽

폰트는 가장 윗부분 지워서 눈누 - 상업용 무료한글폰트 사이트 (noonnu.cc) 에서 마음에 드는거 고르기

라이선스는 중요함. 확인 필수

눈 내리는 거 싫으면 animation: snow 10s linear infinite;  지우기

너무 느리거나 빠르면 10s (속도) 바꾸기

안되면 나라카나 하십시오 

형님 기다리다가 백골 되겠습니다

런또홍런또홍

님 맘대로 만들라는 뜻

후원댓글 2
댓글 2개  
이전 댓글 더 보기
TWIP 잔액: 확인중
▲윗글 홍주가 주는 크리스마스 선물 실버미드김홍주
▼아랫글 반성문
0
........ [1]
문과_뛰어쓰기
01-10
0
김홍주가 밉다 [2]
문과_뛰어쓰기
01-08
0
ㅋㅋㅋ
벤츠사랑곽한구
01-02
0
홍주님 질문있어요 [1]
실버미드김홍주
01-01
0
1/1 새해 첫글. ,. ^^
a1b2c3d4e5f6g7h8ij
01-01
0
첫 전과 [1]
문과_뛰어쓰기
12-31
0
사람인증.. [2]
피자먹는콜라
12-28
0
저..ㅠㅠ [1]
Broadcaster 챌린저미드김홍주
12-27
0
훈훈한 롤영상
실버미드김홍주
12-25
0
12-24
»
홍주가 만드는 트게더 [2]
a1b2c3d4e5f6g7h8ij
12-19
0
반성문 [1]
음악은취미로하자
12-17
1
홍주사진 유출댐 ㄷㄷ [1]
가락에서미드로
12-17
0
홍주님 [2]
parkcy1
12-16
0
홍스코드 [2]
베스만
12-15
0
홍주님 그러고보니... [2]
나눈멍충이
12-15
1
반성문 [1]
씨부이맥스
12-13
0
여기가,,,어디,,? [1]
실버미드김홍주
12-12
0
메뉴 못고르는 홍주 [1]
실버미드김홍주
12-12
0
12-12
0
12-12
0
12-12
0
12-12
0
김홍주의 꼰대테스트
실버미드김홍주
12-11
0
12-11
인기글 글 쓰기