CSS Winner에서 한국인 지원자를 검색해보다가 SERIOUS를 알게 되었다.http://www.csswinner.com/details/serious-study/10663 Interaction Study Lab인데 사이트가 무척 마음에 든다.특히 인트로에 노이즈 효과가 시선을 확 당겼다. See the Pen Pure css - Noise Effect by Hyejin Oh (@mmt-zinee) on CodePen. clip과 content:attr()을 사용한 것이 주요 특징이라고 할 수 있다. content는 가상선택자(:before/:after)를 사용할 때 content: ''으로 제일 많이 썼었는데 다양한 활용 방법이 있다는 걸 오늘 알았다. 참고 https://css-tricks.com/..

css-tricks.com/styling-cross-browser-compatible-range-inputs-css/ See the Pen [Pure CSS] input range custom by zinee (@zineeworld) on CodePen.

keyword 인데 keywords로 해놓고 하루 종일 왜 안되지? 이러고 있었다.

See the Pen Band Corona - TopViewCount50 by Hyejin Oh (@zineeworld) on CodePen.

테스트 범위 Gmail App/WebYahooMail App/WebHotmail(Outlook) App/Web 참고 사이트 https://www.campaignmonitor.com/css/ http://webdesign.tutsplus.com/series/mastering-html-email--webdesign-17696 http://freshinbox.com/resources/css.php (2015.12) http://kb.mailchimp.com/campaigns/ways-to-build/css-in-html-email (2016.08) 이슈 이메일 클라이언트 템플릿을 만들 때에는 주의해야 할 것들이 많다. 인라인으로 CSS를 적어주는 것이 가장 안전하다. 안되는 CSS 속성들도 많으니 신경 써야 ..

See the Pen Youtube Text Ellipsis Principle by Hyejin Oh (@mmt-zinee) on CodePen.

요구사항 유튜브에서 검색 결과를 가져온다.q = '아티스트명(artist name) offical' (ex. 밴드코로나)order = viewCOunttype = videovedioDefinition = high왼쪽에 1개의 동영상을 플레이어로 출력한다.오른쪽에 10개의 비디오를 리스트 형식으로 출력한다. See the Pen Youtube Search Example by Hyejin Oh (@mmt-zinee) on CodePen. 참고iframe APIhttps://developers.google.com/youtube/iframe_api_reference?hl=kohttps://developers.google.com/youtube/player_parameters?playerVersion=HTML5&h..

요구사항최종 사용자는 HTML5 postMessage 기능을 지원하는 브라우저를 사용해야 합니다. 대부분의 최신 브라우저가 postMessage를 지원하지만 Internet Explorer 7은 지원하지 않습니다. 내장 플레이어에는 200x200픽셀 이상의 표시 영역이 있어야 합니다. 플레이어에 컨트롤이 표시되는 경우에는 표시 영역이 최소 크기 미만으로 축소되지 않고 컨트롤이 완전히 표시될 만큼 커야 합니다. 16:9 플레이어의 경우 가로 480픽셀, 세로 270픽셀 이상으로 지정하는 것이 좋습니다. [출처] https://developers.google.com/youtube/iframe_api_reference?hl=ko#Requirements 유튜브 권장 최소 가로/세로 폭 200px, 아래의 설정 ..

See the Pen VjQoEg by Hyejin Oh (@mmt-zinee) on CodePen. https://github.com/darlanrod/input-range-scss