Code 8
[css] 내비게이션(gnb) 만들기 03 - 가로로 정렬하기
안녕하세요. 개자이너 씸플레이입니다. 오늘은 드디어 css를 진행합니다! 1. 기본사항 살펴보기 ① 기본사항 참고사항 : 리스트 데코레이션이나 태그에 적용된 색들은 미리 빼두었습니다. 기본적으로 태그는 블록 태그이기 때문에 글씨가 옆으로 써지지 않고 아래로 써집니다. 원하는 디자인 : 로고 옆으로 카테고리들이 가로로 나열되면 좋겠다. ② 블록 태그 줄 노트를 상상해보세요. 그리고 한 줄이 한 블록이라고 상상해봅시다. 그 한 줄을 혼자서 차지하는 태그가 블록 태그입니다. 카테고리1 라고 적으면 한 줄에 카테고리1이라는 글자만 써야 한다는 의미죠. 2. 내비게이션을 오른쪽으로 ① 원하는 이미지 상상하기 각자 원하는 내비게이션의 이미지가 있을 거예요. 처음은 어렵지 않게 제가 이미지를 보여드리겠습니다. 원하는..
[html] 특수문자 03 - 그레이브, 틸드
안녕하세요. 개자이너 씸플레이입니다. 특수문자의 이름 알아보기 3편입니다. 이렇게 연달아 같은 시리즈를 3편 올리는 게 처음인 것 같은데, 어떠신지 의견이 궁금합니다. 이어서 보기에 편하신지, 너무 자주 반복되는 것 같아 지루하신지 댓글로 의견 남겨주세요~! 1. 그레이브 ( ` ) ① Grave 그레이브는 숫자키 1번 왼쪽에, 탭키 위쪽에 있는 키입니다. 보통 물결 표시와 같이 있는 키입니다. shift를 누르지 않으면 그레이브죠. 작은따옴표처럼 생겼지만 삐침이 좀 더 강한 녀석이죠. `(그레이브) '(작은따옴표) 차이가 느껴지시나요? 2. 틸드 ( ~ ) ① Tilde 틸드는 위에서 봤듯이 그레이브와 같은 곳에 있는 키입니다. 그레이브 키에서 shift를 누르면 사용할 수 있죠. 보통 물결무늬, 물결..
[꿀정보] 게시판에서 지도 가운데 정렬 하기
가끔 게시판에 지도를 불러오면 지도만 가운데 정렬이 안될 때가 있죠? 이럴 때 간단하게 소스로 가운데 정렬을 해줄게요. 코드를 조금 다룰줄 아시는 분들은 바로 4번을 봐주세요. 1. 왼쪽정렬 된 지도 게시판 수정에 들어가서 아무리 가운데 정렬을 눌러도 이렇게 지도로 가져온것에는 가운데 정렬이 안 먹을 때가 있어요. 그렇다면 게시판에서 제공하는 에디터 말고 소스로 수정을 해줍시다. 괜찮아요 어렵지 않아요. 2. 소스보기 대부분의 게시판 작성 모드에서는 HTML 소스보기를 제공해줍니다. 티스토리도 제공해주는 것 아시죠? 보통은 맨 왼쪽 끝이나 맨 오른쪽 끝에 있어요. 지금 사용하는 게시판은 맨 왼쪽에 있네요. 저 HTML 소스 버튼을 눌러줍니다. 으악 영어다!!! 자, 진정하시고 여러분은 이 모든 글을 다 ..
[html] <!DOCTYPE html> 대충 이해해보기
안녕하세요. 플입니다. 대충 이해해보기 시리즈 2탄입니다. (시리즈 해볼까 봐요) https://ssimplay.tistory.com/370 [html] html을 대충 이해해보자 안녕하세요. 플입니다. 오늘은 html에 대해서 이해해보도록 해요 1. html html은 "Hyper Text Mark-up Language"의 약자입니다. 하지만 이렇게 말하면 너무 어렵고 무슨 소리인지 모르겠죠. html은 웹페이지�� ssimplay.tistory.com 1탄 링크도 첨부해두겠습니다. 1. 선언하기 html 문서를 보시면 가장 위에 이라는 문구를 보신 적 있으실 거예요. 뭐야 그런 거 모르겠어하시는 분들을 위해서 익숙하실 티스토리 편집 모드 화면을 캡처해봤습니다. 가장 위에 보이시나요? 원래는 대문자로 ..
[codepen] 코드펜을 티스토리에 불러와보자
안녕하세요. 플입니다. 오늘은 코드펜을 이용해 코드를 불러와볼 거예요. 1. 코드펜 https://codepen.io/ CodePen An online code editor, learning environment, and community for front-end web development using HTML, CSS and JavaScript code snippets, projects, and web applications. codepen.io 우선 코드펜 사이트에 접속해줍니다. 그리고 로그인을 해주세요. 2. 코드 작성 오른쪽 메뉴 맨 위를 보시면 Pen이라는 메뉴가 있는데요. 이 메뉴를 클릭해주세요. 그러면 이렇게 간단하게 코드를 짤 수 있는 공간이 나와요. 아무거나 짜 볼게요. 코드는 제가 아무..