본문 바로가기

전체 글349

2021년 추석명절 SRT 온라인 예매 일정 안내 이번 2021년 추석명절 SRT 티켓도 지난 설과 마찬가지로 비대면 예매만 가능하다고 한다. 사실 아침 일찍 가서 기다릴 수만 있으면 현장발매가 훨씬 유리한데 (인터넷은 성공률이 너무 낮...ㅜㅜ) 코로나19 확산 방지 및 국민의 안전 강화를 위한 조치라고 하니 아쉽지만 어쩔 수 없다. 원하는 날짜, 원하는 시간대 예약할 수 있기를 바라며 블로그에도 추석 SRT 온라인 예매 일정을 포스팅하려 한다. - 특별 수송 기간 : 2021년 9월 17일(금) ~ 9월 22일(수) - 예매창구 : 명절 예매 전용 홈페이지 pc, mobile 이용(경로, 장애인에 한정하여 전화 접수도 가능) http://etk.srail.kr 승차권 예약/발매 - SR 시간 선택 20시 이후 00시 이후 02시 이후 04시 이후 0.. 2021. 8. 31.
부모 속성을 상속하는 CSS 태그 모음 자식 태그에 특별한 속성이 지정되어 있지 않으면 자동으로 부모 속성을 물려받아 스타일링되는 태그들이 있다. color font-family font-size font-weight line-height list-style text-align text-indent text-decoration letter-spacing opacity visibility 보통 글자, 정렬과 관련된 css 태그들이 그대로 상속되는 듯 하다. 그리고 예외적으로 태그에는 color 속성이 상속되지 않는데, 상속되지 않는 속성을 강제로 상속시킬 때는 해당 css에 inherit 라는 속성값을 사용하면 된다. 더해서, 자식의 자식 요소에는 스타일링이 적용되지 않는다는 것도 알아두자. 구글 사이트로 이동하고 싶다면 여기를 클릭하세요! 2021. 8. 17.
CSS 우선 적용 순서 같은 요소에 다른 CSS 속성이 중복 설정되어 있다면 어떤 것을 우선순위로 적용될까? 아래와 같은 순서로 우선순위가 적용된다. 속성값 뒤에 !important 가 붙어있는 속성 인라인 스타일(html 파일에서 스타일 직접 지정)로 적용되어 있는 속성 선택자에 id가 쓰인 속성 class, attribute, pseudo-class로 지정한 속성 태그 이름으로 지정한 속성 부모 요소에 의해 상속된 속성 이때 만약 똑같은 선택자가 아래에 반복해서 나오면 이전의 것을 덮어쓰게 된다. 이전의 것을 덮어쓰지 않으려면 !important를 사용해 주어야 한다. 안녕? 친구하지 않을래? 2021. 8. 17.
CSS 선택자 모음 예전에 한번 간단하게 정리했던 적이 있는 CSS 선택자... 그 당시에 빠뜨린 것도 있고 해서 이번 기회에 더 자세히 정리해 보았다. 태그 이름 태그 이름은 그냥 이름만 기재해서 바로 스타일링이 가능하다. 해이나 월드 안녕, 친구하지 않을래? 클래스 & 아이디 클래스는 마침표(.)로 시작, 아이디는 샾(#)으로 시작한다. 해이나 월드 안녕, 친구하지 않을래? 자식 & 직속 자식 자식과 직속 자식은 css로 스타일링 해줄때는 아래와 같이 표기한다. 아래 예제에서 자식에 스타일링을 한 경우 해당 박스 안에 태그를 가지고 있는 모든 요소에 적용되는 반면, 직속 자식에 스타일링을 한 경우 다른 태그로 한번 더 감싸진 태그는 스타일링이 적용되지 않는다. 나는 box의 직속 자식입니다. 나는 box의 직속 자식은 .. 2021. 8. 16.
배경이미지(background) 관련 CSS 모음 오늘은 광복절 대체휴무일이다. (출근 안 하는 날+_+) 그래서 새벽에 CSS를 정리하는 블로그 포스팅을 하고 있다 (후후훗-_-v) 이번 포스팅에서는 배경이미지(background)와 관련된 CSS 속성을 알아보도록 하겠다. background-color 배경색으로 색상을 지정하고 싶을 때 사용한다. HEX, RGB, 색 이름 직접 지정 모두 가능하다. 만약 배경 이미지와 중복으로 사용한다면, 이미지의 투명한 부분이 있을 경우에 그 부분을 통해 해당 색상을 확인할 수 있다. background-image 배경에 이미지(사진)를 넣고 싶을 때 사용한다. 아래와 같이 경로를 사용하여 지정하면 된다. 미리 준비한 배경이미지를 넣어 보았는데 div의 너비와 폭이 100px로 지정되어 있어 배경이미지가 잘려 보.. 2021. 8. 16.
자바스크립트 숫자형 사칙연산 자바스크립트 숫자형 사칙연산을 해 보았다. 얼마 전 파이썬 사칙연산 강의를 들었는데 명령어를 제외하고는 거의 다 겹치는 부분이라서 부담 없이 진행할 수 있었다. 우리가 아는 덧셈, 뺄셈, 나눗셈 등 연산기호가 동일해서 거창하게 설명할 것도 없다. 굳이 덧붙여 보자면 퍼센트 기호(%)를 사용해서 a % b라고 쓰면 a에서 b를 나눈 나머지값, 별표(*) 기호를 두번 쓰면 거듭제곱의 의미라는 것 정도일 듯 하다. 여러가지 연산 기호가 동시에 사용되었다면 곱셈과 나눗셈 먼저, 괄호가 있다면 괄호 먼저 계산하는 사칙연산의 기본 규칙도 그대로 따른다. 더 쉽고 빠른 이해를 위해 아래에 예제를 첨부한다. console.log(1 + 8); // 덧셈, 결과값 9 console.log(5 / 2); // 나눗셈, 결.. 2021. 8. 13.
2021년 경기도 청년복지포인트 2차 신청기간 2021년 경기도 청년복지포인트 2차 신청기간이다. 경기도에 거주하면서, 경기도 소재 중소기업, 중견기업, 소상공인업체, 비영리법인에 재직중이라면! 본인의 나이가 만 18~34세 청년이라면! 1년간 120만원을 포인트로 지급받을 수 있는 청년복지포인트를 신청해보는 것도 좋을 것이다. 2021년 청년복지포인트 자격요건 연령 만 18세~34세 청년 근로자 (병역의무이행 기간만큼 신청 연령 연장 - 최고 만 39세까지) 거주지 주민등록상 거주지 - 경기도 근무조건 경기도 소재 중소 / 중견기업, 소상공인업체, 비영리법인 재직자 중 주 36시간 이상, 3개월 이상 근무자 (비영리법인 중 국가 지방자치단체, 공공기관 재직자 제외) - 4대 사회보험 미가입자도 시니청 가능 - 내일채움공제, 청년재직자내일채움공제, .. 2021. 8. 10.
박스 사이즈를 결정하는 box-sizing : content-box | border-box; 오늘은 박스 사이즈를 결정하는 box-sizing 태그에 대해서 알아보려고 한다. 모르고 있어도 치명적인 문제는 발생하지 않지만, 알고 있다면 분명 꿀팁이 될 것이다. 문제 인식 아래와 같이 Hello world! 라고 적혀있는 div 박스 하나를 만들었다. 그리고 해당 박스의 사이즈를 가로 200px, 세로 100px로 설정하고 3px 두께의 테두리와 20px 내부 여백도 주었다. 그리고 나서 결과를 확인해보면, 보여지는 박스의 사이즈가 내부 여백(padding), 테두리(border) 사이즈까지 더해져서 초기에 설정해준 것보다 커져 있다. - 가로값 : width 200px + (padding 20 * 2) + (border 3 * 2) = 200 + 40 + 6 = 총 246px - 세로값 : he.. 2021. 8. 7.
맥북 - 아이폰 문자 메세지 연동하기 맥북에서도 연락처를 이용하여 iMessage를 보낼 수 있는데, 사용하고 있는 아이폰과 문자 메세지 연동이 되지 않아서 불편한 점이 많았다. 워낙 귀차니즘인지라 조금 불편하게 쓰지 뭐, 하고 있었는데... 이번에 클라이언트와 일정 조율을 할 일이 있어 맥북에서 메세지 앱을 사용하게 되었다. 메세지를 보내놓고 여차하면 답장을 놓치겠구나 싶어서 인터넷에 검색한 후 연동을 완료했다. 드디어! 몇년만에! 십년 묵은 체증이 다 내려간 기분이다. 아이폰 연동 방법 맥북 - 아이폰 문자 메세지를 연동하려면 맥북과 아이폰에서 각각 해주어야 하는 일이 있다. 먼저 아이폰에서 진행해야 하는 것부터 설명하도록 하겠다. 설정 > 메세지로 이동한다. iMessage 아래에 '발신 및 수신' 항목을 누른다. iMessage용 A.. 2021. 8. 6.
margin: 0 auto; 가운데 정렬이 되지 않을 때 가운데 정렬을 하는 방법은 여러가지가 있는데 나는 그 중에서도 text-align:center; 와 margin: 0 auto;를 가장 많이 사용하는 편이다. 그런데 간혹 margin:0 auto;를 적용해도 가운데 정렬이 되지 않을 때가 있다. 이러한 상황에서 체크해 볼 수 있는 세가지 방법에 대해서 소개하도록 하겠다. margin: 0 auto; 가운데 정렬이 되지 않을 때 해결방법 1. 가장 첫번째로 해야 할 일은 선언이 제대로 되었는지 확인해보아야 한다. 2. auto는 자동으로 사이즈를 설정해주는 것이다. 그러므로 가로폭의 사이즈를 정확하게 인식할 수 있어야 정렬이 가능하다. margin: 0 auto; 가 반응하지 않을 때에는 해당 영역의 가로 사이즈가 제대로 설정되어 있는지 확인해보고, 만약.. 2021. 8. 2.