본문 바로가기

전체 글

[Css] 위아래로 움직이는 사진,그림,이미지 만들기 & 예제 움직이는 사진,그림,글자 만들기 정적인 글자,그림(사진)에 동적인 효과를 주면 어떨까? 글쓰기 에디터는 글자나 이미지에 동적인 움직임을 주는 기능이 없는 정적임만이 존재하지만 간단한 코드 단 몇 줄로 텍스트 또는 이미지 등 모든 요소에 동적인 힘을 실어줄 수 있다. 이번 주제 강의 포인트 이번 주제 강의 포인트는 css 속성인 animation과 keyframes에 있다. animation과 @keyframes 사용법 예를들어 그림에 동적인 효과를 주려면 그림 요소에 animaton속성을 주어야한다. animation : up-down 1.4s infinite ; 속성 : 키프레임 초단위 반복 이런 식으로 3가지 이상 속성효과를 적용할 수 있다. 그리고 빨간 밑줄로 표시된 키프레임은 앞에 @를 써서 애니.. 더보기
어몽어스 하는법 용어 한국어 번역 해석 어몽어스 하는법 용어 한국어 번역 해석 어몽어스가 한글번역 없이 영어로 나와있어 초반에는 접근성이 약간 있기는 하다. 방 만들고 방 찾는 방법부터 회의소집하는 방법, 회의때 말하는 방법, 꿀팁 등 알려드리려고 한다. 어몽어스를 켜면 첫번째로 보이는 화면에는 1번 방만들기 / 2번 방찾기 크게 자주 쓰이는 버튼이다. 두번째 방찾기로 인원수를 확인하며 방에 입장을 한다. 방에 입장하면 대기실에 입장대기중인 인원이 보인다. 하단 초록색 8/10은 인원수 표시고 노트북을 누르면 캐릭터 커스텀이 된다. 캐릭터 몸통색상은 다른 사람과 중복으로 선택할 수 없다. 그외 커스텀은 자유이다. 10/10 인원이 꽉차면 방장이 시작을 한다. Crewmate(크루원,동료)는 시민팀이고 Impostor(임포스터)는 마피아이다. .. 더보기
(스포O)진격의 거인 4기 넷플릭스 매주방영 3화 줄거리 진격의 거인 4기 3화 줄거리입니다. 브라운 라이너(현 갑옷거인)를 중심으로 라이너의 과거회상이 전개된다. 라이너가 전사후보생 시절때의 이야기를 주로 보여주는데.. 굉장히 익숙한 인물들이 몇 보인다. 베르톨트(초대형거인), 애니 레온하트(여성형거인)... 6명의 전사후보생중 거인을 계승받을자는 단 5명이다. 하지만 라이너의 성적은 꼴찌... 마르셀의 동생이자 전사후보생인(이름 까먹음) 노란머리에게 자주 무시당하며 싸운다. 그렇게 6명 전사후보생중 단 5명만이 거인을 계승받고... 꼴찌인 브라운 라이너가 갑옷거인을 계승하게 된다. 마르셀의 동생이 역시나 라이너에게 "내가 아닌 꼴찌인 네(라이너)가 왜 선발이 된것이냐" 의문을 가지며 화를 내지만 이에 마르셀(턱거인)은 라이너(갑옷거인)에게 "미안하다"는 사.. 더보기
마인크래프트 1.16.5 쉐이더 무료 다운로드 추천 마인크래프트 1.16.5 쉐이더 다운로드 추천 마인크래프트 게임을 하다보면 중요한 것이 있죠. 바로 게임내 그래픽 상향도입니다. 쉐이더나 텍스처팩을 사용하지않고 플레이한다면 화면이 많이 밋밋하고 단조로우면서 매트한 느낌을 받습니다. 하지만 마인크래프트를 하는 이유는 멋지고 아름다운 건축에 있는만큼 멋진 쉐이더,텍스처팩을 사용하면 더욱 더 화려해지고 멋진 나만의 마인크래프트를 즐길 수 있습니다. 아래 사진에서 쉐이더 적용 전후를 비교해보세요. 주의해서 볼 점은 하늘,구름,물,빛반사,잔디와 같은 자연물이 아름답게 변화된 모습입니다. 아무런 쉐이더,텍스처팩을 사용하지 않은 오리지널 기본그래픽 뭔가 단순하고 딱딱한 블록느낌이라 게임 그래픽이 예쁘다는 느낌은 없습니다. 쉐이더 적용으로 고퀄리 상향된 그래픽 같은 .. 더보기
세척이 쉬운 웰포트 가열식 가습기 리뷰 세척이 쉬운 웰포트 가열식 가습기 코로나19로 재난지원금이 무려 3차까지 왔습니다. 춥고 건조한 겨울 실내 필수생활용품이지만 실내에 가열식 가습기를 켜놓으면 공기중 바이러스 번식이 줄어드는 살균작용을 한다고 합니다. 살균작용과 동시에 따뜻한 실내공기를 만들어주는 수많은 가열식 가습기중 다이얼 버튼이 특징인 세척이 쉬운 웰포트 가열식 가습기를 소개합니다. 제품 스펙 모델명 ST-700 스텐 분무방식 전기가열식 가습세기 최대 600cc/h 정격전압 및 소비전력 AC200V / 60Hz / 480w 크기 W230 x D240 x H315(mm) 제품무게 2.3kg 용량 3.6L(유효수용량) 제품 특징 웰포트 가열식 가습기의 특징은 조작방식이 아날로그한 5단계 다이얼식 3.6L 대용량 가습기이다. 가습기중에서 .. 더보기
액토 USB 2.0 & 3.0 허브 HUB 사용후기 USB 2.0과 3.0 두 타입 모두 충족시키는 HUB 추천후기 몇개월전 노트북을 새로 장만하면서 나름 최신 노트북이다보니 USB 꽂는 단자는 3개인데 비해 가장 보편화된 USB 2.0포트는 단 한 개뿐이더랍니다. 2.0 무선 마우스를 쓰고 있어서 2.0 꽂는 곳에는 마우스 인식센서를 꽂아놓고 사용하는데.. 그러면 USB 꽂을 자리가 3.0뿐이 안남더라구요.. 그런데 대부분 제품은 USB 2.0제품으로 보편화 되있어서, 제 노트북의 3.0포트와 결합해 2.0으로 전환시켜줄 허브가 필요했습니다..! 하지만 온종일 인터넷을 뒤져봐도 USB 3.0에서 USB 2.0으로 전환시켜주는 제품 찾는게 의외로 하늘의 별따기였습니다..ㅠㅠ;; 그리하여 찾아낸 액토 허브..!! 인터넷에 판매되는 얼마없는 비슷한 상품들중에.. 더보기
[CSS] 마우스 올릴때 점점 늘어나는 네모칸 상자 만들기 네모난 상자에 마우스를 올리면 상자가 점점 커지는 텍스트 이미지 상자 만드는 방법 평범한 네모칸인데 평범하지 않다? html css에서 '마우스를 올릴때'를 말하는 속성은 Hover 이다. 즉, 다시말해 '마우스를 올릴때' 어떠한 반응을 하게 해주는 속성이다. 이 속성은 어떻게 사용하느냐 어떤 속성들과 조합해서 사용하느냐에 따라 천차만별로 다양한 효과를 만들어 낼 수 있는 아주 유용한 속성이다. Hover 사용 방법 hover는 텍스트(글자), 이미지(사진) 등 골고루 쓰일 수 있는 css 속성이다. 예를들어 div요소에 hover를 사용하고자 한다면, div : hover 라고 써줘야 한다. 아래에서 hover 속성이 어떤식으로 쓰이는지 코드를 보면 더 쉽게 이해가 간다. 활용 예제 아래 네모칸에 마우.. 더보기
스킨푸드 X 네고왕 전품목 7천원 이벤트 구매후기 비비큐 X 네고왕이 핫해지면서 네고왕을 구독하면 혹시 이벤트할때 저렴하게 구매하는데 도움이 되지 않을까해서 한동안 네고왕을 열심히 보더랬죠.. 네고왕 이벤트는 한시적으로만 하는 경우가 많더라구요. 그러던중 광희가 화장품왕을 만나서 전품목 7천원 네고를 했다는 최신 네고왕 방송 소식에 부리나케 스킨푸드 홈페이지에 접속을 했습니다..!! 스킨푸드는 오랜만이지만 광고부터 홈페이지까지 모두 네고왕에 대한 것으로 싹 바뀌었네요~ 스킨푸드 제품이 저렴한 편은 아니지만.. 7천원 쿠폰 1인당 최대3개씩 주면 구매해볼만 하다는 생각에 가족들과 함께 각각 회원가입까지 했어요. 이미 유튭 방송이 게제된지 4일쯤 지나고나서 보고 홈페이지에 들어온거라 그런지.. 주문 접수가 폭주한 듯 합니다..!! 주문량 증가로 한달치 출고.. 더보기
편스토랑 류수영 치치닭 밀키트 편스토랑 류수영의 메뉴인 치치닭 밀키트가 온라인,오프라인 매장에서 판매되고 있습니다. 2인,1인 용량으로 판매되고 있으며 시중 편의점에서 판매되는 요리류중에서는 거진 최상급 밀키트라고 볼 수 있을 정도의 퀄리티를 가진 편의점 조리용 요리입니다. 치치닭은 간장소스의 짭쪼름한 맛에 치즈 소스를 곁들인 홈파티용으로 제격인 프라이드 치킨요리입니다. 보기에도 먹음직스러우며 레시피로 집에서 모든 과정을 따라 만들 수도 있으며 편의점에서 밀키트를 구매해 간단하고 쉽게 조리해 먹을 수 있습니다. 1인용과 2인용으로 나뉘어 판매되고 있습니다. 치치닭 2인은 11,900원쯤입니다. 간단 식사 대용이나 간식이나 안줏거리로 알맞은 가격인 듯 합니다. 방송에서 류수영이 직접하는 요리과정을 그대로 레시피를 따라서 만드는 분들도 .. 더보기
[CSS] 코드로 회전하는 '로딩중...'표시 만드는 법 Html,Css만을 이용하여 코드로 회전하는 '로딩' 표시 만들기 스피어란? 로딩중일때 표시되는 모양은 주로 원형 모양으로 제자리에서 무한회전하는 모습이다. 이 모습을 본따 로딩 표시 기능을 '회전하다'를 의미하는 영단어인 '스피어'라고도 한다. 수 많은 웹페이지에서 서핑을 하다보면 웹페이지내 용량이 많아 로딩이 길어지거나 짧은 로딩에도 인위적으로 디자인적인 요소를 주기위해 '로딩중'표시를 넣는 경우가 많다. 스피어 사용 예시 -여러 색깔로 변하며 무한회전하는 스피어 흔히 자주 보는 원형 모양의 스피어 코드 적용하기 HTML-------------------------- CSS------------------------------ $green: #008744; $blue: #0057e7; $red: #d.. 더보기