[마크다운 & 태그] #5 - 타이틀과 하단 레이아웃

in #kr6 years ago (edited)



#5 - 타이틀과 하단 레이아웃

이번 마크다운은 타이틀과 하단 레이아웃입니다.
제가 직접 써보고, 앞으로도 계속 쓸만한 것들만 모아보았습니다.
작은 영역인 상단과 하단만 신경써도,
글의 첫과 끝이 인상깊을 수 있거든요.






타이틀 레이아웃

Title 1
팁 : <pre></pre>를 쓰시면 영문폰트를 다르게 쓸 수 있어요.
맥에서 보면 영문 타자기체로 나온답니다. 윈도우는 폰트만 약간 달라져요.




S T E E M I T  W R I T E R S

   A little space to be creative  





TItle 2
이 타이틀이 쓰인 글 링크


그냥 가만히 있었는데요
Written by @tagyourname





Title 3
이 타이틀이 쓰인 글 링크



이렇게 작지만 확실한 행복
무라카미 하루키 | 문학사상 | 2015.06.26





Title 4
아직 안 써봤지만 추천..!



바깥은 여름

풍  경  의  쓸  모












인용문, 하단 양식

Quotation 1
글 중간에 인상깊은 문장, 구문에 넣으면 좋을 것 같아요.




작은 디테일로
글에 영혼을 불어넣어볼까요






Quotation 2
브런치 글에서 보던 그 북마크! 만들어봤습니다.




이 이미지는 다음 브런치 포스팅에서 벤치마킹했어요.
글 마지막에남기고 싶은 메시지 또는 태그와 함께 사용해보세요.

#kr-movie | #kr-book | #kr-travel | #essay | #kr-pen








이 글의 소스코드

이 글의 소스코드는
세계님이 만들어주신,스팀툴 에서 보실 수 있습니다.


코드보기전에

기초 마크다운 팁
이지스팀잇-마크다운을 알아보자1
이지스팀잇-마크다운을 알아보자2

고급 마크다운 팁
낸드님 -마크다운 심화와 태그
Slay님 - 왼쪽 및 오른쪽 정렬하는 법과 이미지 옆에 문단을 정렬시키는 방법


지난글

#1 - 티져 (feat.글자반 여백반)
#2 - 잡지같이 포스팅해보자
#3 - 핀터레스트 스타일로 포스팅해보자
#4 - 세로로 된 타이틀이 적힌 양식


몇 일 바빠서 글을 오랜만에 올리는 기분이네요ㅎㅎ
div를 더 파보고 싶었지만, 모바일에서 레이아웃이 변형되어서 잠시 손을 놓았습니다.
좀 더 간략하면서 효과적인 양식을 생각하다가 타이틀, 하단양식을 공유드립니다.
글쓰기에 마지막 기분좋은 터치로 쓰였으면 하는 바램입니다 :-)
또 언제 공유할 수 있을지 모르겠지만, 새로운 발견이 있으면 또 엮어서 공유하겠습니다.

Sort:  
There are 2 pages
Pages

경아님 하단양식 디자인이 너무 예쁩니다. 다음에 제 글 포스팅할때 써도 괜찮을까요?
@칭찬해
(이건 허락받기 위한 뇌물입니다)

당연하죠! 누구나 써도 됩니다!ㅎㅎ 모두들 마음껏 쓰세요!

감사합니다 ^^ 오늘쓴포스팅에 적용해봤어요 으흐흐흐 글이 사는 느낌입니다 ㅋㅋ

배꼽잡는 @kyunga님 안녕하세요! 개사원 입니다. 멋진 @carrotcake님 소개로 왔어요. 칭찬이 아주 자자 하시더라구요!! 황홀한 글 올려주신것 너무 감사해요. 작은 선물로 0.4 SBD를 보내드립니다 ^^

오오오 좋은 정보 감사합니다.
조악한 스팀잇에디터에 지쳐
카드뉴스를 제작하고 있었는데

근데 이거 공부를 쫌 해야겠...쬬?

줄 나눔이랑 타이틀 정도만 썼었는데
하단의 양식들은 너무 고급지고 좋으네요
연구해서 써봐야 겠습니다 감사합니다 ;D

이번에도 역시 세련됨과 정갈함의 코드들이 올라온 것 같아 기쁩니다. 날의 변덕이 심한 하루인데, 모쪼록 잘 마무리하시길 바라고 즐거운 주말되시길 바랄게요.

역시 금손 경아님+_+

우와~ 마크다운사용해보지 않았는데, 포스팅이 완전 고급진 느낌?^^
경아님, 요고 비지에서 다 적용되는건가요?
이제 비지 태그 입문하거든요~

네 비지에서 다 적용됩니다ㅎ
다만, 느낌이 약간 다를 수 있어요. 직접 해보시면 아실꺼에요ㅎㅎ

오 ! 스팀툴이란게 있다니!! 스팀잇은 다닐 수록 배움이 가득한 곳이에용. ㅎㅎ
글자 넘 이쁘네용
저도 마지막 메세지 라인을 슥 복사해서 써보겠습니당 ^^ 감사합니다!

오... 유용합니다...
저는 꽝손이라 쓸수 있을진 모르지만 일단 리스팀 해둡니다 ㅎㅎ

이번꺼가 제일 간단합니다! 시도해보세요ㅎㅎ
리스팀 감사합니다 :-)

^^ 좋은 팁 제가 감사하죠... 잘 쓸 수 있을진 모르겠지만요 ㅎㅎ

또 공부해야 겠군요....
타이틀 유용할 것 같습니다.^^
이미지랑 같이 써봐야지 ㅎㅎㅎ

호돌박님 기대할께요!ㅎㅎ
주말 잘 보내시구요!

경아님 타이틀 너무 예뻐요:) 리스팀해놓고 활용해 볼게요!

편집 너무 잘하셔서 제가 뭐 팁을 드릴게 없는데ㅎㅎ
리스팀 감사합니다!ㅎㅎ

ㅋ ㅑ........너무 멋지십니당!! +_+

어웅 진짜 깔끔해요@.@

언제 날 잡아서 경아님께 특훈을 받아야 할것 같은데요! ㅋㅋ

ㅋㅋ독거님이라면 언제든요!!

아. html 코드도 일부 혼용되는군요. 마크다운 지원이 너무 제한적이다 싶었는ㄷ.... 뭐든 유심히, 잘 봐야겠습니다. 좋은 팁 감사합니다. :)

경아님은 마법사 시군요! ^^

마법사는 아니고요ㅋㅋ 잡부 정도 됩니다ㅋㅋ
남은 주말 행복하시구요!ㅎㅎ

그야말로 격을 올리는 양식들이네요. 꼭 써먹겠습니다. 감사합니다!

격을 올리다니, 엄청난 칭찬을 들어버렸네요ㅎ
감사히 받고 더 멋진 팁들 모아올께요ㅎㅎ

우와 너무 깔끔하고 예뻐요. 디테일의 중요성...b 좋은 정보 감사합니다 :)

마크다운을 하면 이렇게 예쁜 페이지를 만들수 있는거네요? 대단하신데요

오늘도 역시 경아님께 충성충성!! +_+

저도 초코님께 충성충성!!ㅋㅋㅋ

깔끔하고 이뻐요. 멈추지 않는 아름다운 경아님 ㅎㅎㅎㅎ

시간내어 공부 좀 해야 겠습니다. 잘 이용하니 글이 아주 예쁘지네요

다른분들 글 보다보면 경아님 마크다운 쓰신분들 정말 많이봤어요. 여러워서 시도를 못해봤는데, 다른건 몰라도 타이틀1은 저도 한번 시도해봐야겠어요!!ㅋ

P님 이번꺼가 젤 간단한 코드니까 복사해서 활용해보세요ㅎㅎ
지난번꺼까지 넘 어려워서 많은분들을 혼란스럽게 해드린것 같아 간략한걸로 준비했답니당ㅋㅋ

글짜 모양 바꾸는거 정말 알고 싶었는데... 정말 감사합니다.
글짜 색깔 바꾸는건 스팀잇에서는 아직 아 먹히나요?
3종세트 하고 갑니다.

아쉽게도 글자색 바뀌는건 안되더라구요ㅎ 배경색도ㅋㅋ
위에 링크된 낸드님글에 가시면 실험하셨던 리스트를 보실 수 있습니다ㅎㅎ

감사 드립니다.

언제나... 마크다운의 한계를 뛰어넘는 경아님
@홍보해

라라님 감사합니다ㅎㅎ
도움이 되셨을지 모르겠네요~!

@kyunga님 안녕하세요. 겨울이 입니다. @lalaflor님이 이 글을 너무 좋아하셔서, 저에게 홍보를 부탁 하셨습니다. 이 글은 @krguidedog에 의하여 리스팀 되었으며, 가이드독 서포터들로부터 보팅을 받으셨습니다. 축하드립니다!

깔끔하네요 ㅎㅎ 나중에 글 쓸때 적영해 봐야겠네요

이과출신은 웁니다ㅜㅜ

울지마세용ㅋㅋ 이과출신이면 더 잘하실 수 있습니다ㅋ 원리를 바로 아실테니ㅎㅎ

정말 멋지고 다양한 마크다운이 있네요.ㅇㅅㅇ+
알려주셔서 감사합니다~!!>ㅁ<

울곰님 감사합니다ㅎ
그림보러 구경갈께요 >_<

감사합니다. 이런 사용법을 다 일일이 ㅜㅜ

제 마크다운은 만들어주신 툴에 비하면 넘 소소해요ㅎㅎ
좋은거 만들어주셔서 항상 감사하죠 :-)

마크다운만으로도 디테일이 다른 포스팅을 할 수 있다는 걸 배웁니다.
#1부터 보고 있었는데 역시 이번이 제일 맘에 드네요.

저는 요즘 구분선에 이미지를 넣을 연구를 하는중 입니다.
가령 이런거? (대역폭을 좀 잡아 먹겠지만요)

1526640192879.jpg

물론 힌트는 경아님 포스팅에서 얻었구요. sndbox에서도 얻었어요..ㅎ

조만간 포스팅 할 수 있으려나 모르겠네요.
주말 잘 보내세요.

감사합니다.
저도 연필선 같은걸로 몇 번 테스트는 해봤는데, 원하는 느낌이 안나오더라구요.
야니님이 예쁘게 만들어주세요!ㅎㅎ

공유 감사해요..! 혜자십니다.. 리스팀 하고 갑니당~

하단양식 너무 예뻐서 담아갑니다(ღ˘⌣˘ღ) 감사합니다!!

그동안 제가 딱 궁금해하고 있었던 필요한 부분을 어떻게 아시고... ㅎㅎ 완전 감사합니다~!

오 통했네요ㅎㅎ
남은 주말 잘 보내시구요!

경아님도 남은주말 좋은시간 보내세요 :)

자주 보게될 게시글이네요~ 마크다운 너무 어려워요.. 명령어 외우기도 어렵고.. 글자체는 더더욱ㅠ 글자 강조하는 것만 쓰게 되네요ㅋㅋ

너무 예쁘네요^^ 감사합니다!!

유익한 정보 감사합니다.
리스팀합니다.

달필님 리스팀 감사합니다 :-)

와 느낌 있습니다.


@kyunga님은 마크다운의 마술사입니다.
q 태그는 저도 이번에 처음 알았습니다.


댓글로 응용해주시니 새로운데요?ㅎㅎ 센스!!
마술사라기보다는 잡부에 가깝습니다ㅋㅋ

경아님이 쓰는 스티밋은 베타버젼이 아닌가봐요..
어찌 이리 다른단말입니꽈ㅋㅋ

해상도가 달라지는건 커버 못하니까...베타 맞습니돠...ㅋㅋㅋ
네드는 에디터를 개선해달라!!!!ㅋㅋ

진짜 짱입니다...ㄷㄷㄷ ^^b

우와~ 너무좋네요. 경아님 최고네요~ 대단대단!

경아님 덕분에 저 방금 쓴 글에서 이미지 양옆으로 하는법 배워서
써먹었습니다^^
감사드리며 한번 봐주세요^^

네네! 지금 구경하러 갑니다ㅎㅎ

오, 멋지네요. 역시 공부를 해야 결과물이 좋아지는군요. :)

잡지필 마크다운
궁금할때마다 방문해야 겠습니다. ㅎㅎㅎ

와 이거 정말 대박꿀팁이네요...!!! 감사합니다!ㅎㅎ

역시나 대박ㅎㅎㅎ 참고해봐야겠습니다 ^^

덕분에 마크다운을 조금은 더 제대로 쓸 수 있겠네요.
소중한 공유에 감사드립니다. 적극 활용해보겠습니다~

타이포그래피에 관심이 엄청 많은 개발자입니다.
보기만해도 흐뭇하네염 ~

경아님, 아름다워요.

또 샤샤샥~!

There are 2 pages
Pages