본문 바로가기
오픈된 독백

연구랩 블로그 개편사항 - Book Club 스킨 최적화

by 연구랩★ 2020. 4. 11.

           

 

 

 

  <!--

<h1>

         <a href="https://businesslab.tistory.com/">

                     <s_if_var_logo>

                                <img src="" alt="티스토리스쿨 5분전">

                     </s_if_var_logo>

                    <s_not_var_logo>

                               티스토리스쿨 5분전

                    </s_not_var_logo>

            </a>

   </h1>

     -->

 ----------------------------------------------------

  스킨 편집 - html편집 - 위 사항을 제거하면 상단에 위치한 블로그명이 사라집니다. 

( * 제거한 위 사항은 <body>영역의 <header> 부분에 위치합니다.)

 

 

3. 상단 이미지 투명도 조절하기  - 투명도가 약해서 흰 글씨가 잘 보이지 않는 문제 보완 

   스킨 편집 - html 편집- css 수정 - 제 경우 1060번째 줄에 아래 해당 부분이 있습니다.

--------------------------------------------------------

  .post-cover:before {

          content: "";

          position: absolute;

           top: 0;

           left: 0;

           z-index: 0;

           width: 100%;

           height: 100%;

           background-color: rgba(0,0,0,0.65); /** rgba(0,0,0,0.25);

---------------------------------------------------------------------

위에서 background-color 속성을 변경 , 괄호 안에서 가장 마지막 부분(위 코드에서는 0.65)이 투명도를 설정!

기본값은 0.25로 되어있습니다. 이  값을 크게 해주면(1과 가깝게) 투명도를 조절할수 있습니다.

 

4.

 

  상단 이미지 크기 조절 , (위 이미지의 높이 조절)

   css에서 1046번 줄 height : 340px -> 205px로 변경! 

    더 줄이고 싶은데 줄일수가 없네요. 수치를 줄여도 최소 변경치의 한계가 있네요.

    4월16일 다시 원래대로 복구 1049줄 height : 205px ->340

5.

상단 이미지 축소로  상단 이미지와 본문거리도 조절

    css에서 440번 줄 padding-top : 339px -> 180px로 변경!

    180으로 변경하니 모바일에서 약간 겹치네요 255으로 변경!

   4월16일 다시 원래대로 복구 443줄 padding-top : 255 ->339

6. 블로그 최상단 배너광고 삽입 (예정) 4월 16일 배너광고 배치 완료

 

7.

    블로그 메인 페이지 메뉴와 글 목록사이 간격 줄이기

    css #content  부분 수정  padding 부분 숫자만 수정

   속성은  padding  위,  오른쪽&왼쪽, 아래이고 첫번째 숫자만 수정해주면 된다.

   cf. 343줄   디폴트값 padding 72px  0  60px; -> 15px 0 60px;

 

8.

        사이드바 영역의 카테고리 상단 여백 줄이기  css #aside 

        cf. 357줄  디폴트값  padding 75 0 32 -> 16 0 32 

 

   

반응형

댓글