평범한 개발자 행복한 가족, 패밀리그램

개발/HTML,CSS

Gmail 서명 등록, Style 서명 등록하기

패밀리그램 2021. 9. 2. 21:14

Gmail 에 서명을 등록하려고했다.

서명을 등록하는 방법은 아래와 같다

설정 버튼 - 모든 설정 보기 - 서명 메뉴

오른쪽 상단에 설정 버튼이 있다

해당 버튼을 누르면

모든 설정 보기 버튼이 보인다

설정 메뉴 진입 후 아래로 스크롤을 내리다보면 서명 이라는 항목이 보인다. 새로 만들기 를 눌러 신규 서명을 등록한다

신규로 등록한 서명에 편집메뉴를 이용하여 본인만의 서명을 만들 수 있다.

 

HTML을 이용한 Style 복사

HTML 으로 작성된 서명을 복사해서 붙여넣는 것 또한 가능하다. 

우선 서명으로 사용할 HTML 을 작성해보자, 

 <hr
   style="background: #303238; height: 2px;" />
   <div
     style="display: flex; align-items: center;">
       <span
         style="font-size: 16px; color: #222426; font-weight: bold;">패밀리그램</span>
       <span
         style="font-size: 12px; color: #98A1B2; font-weight: bold; margin-left : 8px;">주인</span>
 </div>

각 Element tag 에 style을 직접 적용해 주어야한다. CSS 로 분리하는 경우 복사 붙여넣기에는 문제없지만, 실제 적용 시 적용되지 않을 수 있다.

<img /> 를 이용해 이미지 도 등록이 가능하지만, Gmail 서명으로 실제로 적용 했을 때는 강제로 제거되니 이미지 등록은 포기하는 것이 좋다.

네이버 이메일의 서명은 HTML 을 통째로 넣어 등록이 가능한데, 네이버 이메일 서명은 이미지도 추가가 가능하다

HTML이 적용된 Style 서명

HTML 으로 작성한 서명을 드래그하여 Ctrl + C 로 복사하여 붙여 넣으면 작성한 스타일 그대로 서명이 넣을 수있다.

 

복사 붙여넣이 하였을 때는 align-items style 옵션이 적용되어 정상적으로 보이지만, 실제로 서명에 등록하였을 때는 vertical center 가 적용되지 않으니 참고해야한다.

반응형

'개발 > HTML,CSS' 카테고리의 다른 글

css scroll 없애기, Scroll 비노출 with SCSS  (0) 2021.04.20