[B! HTML5][CSS] alice_rのブックマーク

alice_r id:alice_r

HTML5とCSSに関するalice_rのブックマーク (7)

ログインをもっと快適にオープンソースのログインフォーム10選「10 Open Source Login Pages Built With HTML5 & CSS」
ログインをもっと快適にオープンソースのログインフォーム10選「10 Open Source Login Pages Built With HTML5 & CSS」会員登録ページや管理画面へのアクセスに使用するログインページ。シンプルなものが一般的ですが、こだわりを見せることでサイトのクオリティは高まります。今回はそんな時に参考にしたい、オープンソースのログインフォーム10選「10 Open Source Login Pages Built With HTML5 & CSS」を紹介したいと思います。 Sign in 10種類の、それぞれ個性をもったログインフォームがピックアップされています。詳しくは以下 Login Form ログインフィールドにドロップシャドウがかかった、フォームやボタンのエッジが丸い、柔らかい印象のフォーム。フラットテイストなトレンド感を感じさせるデザインですね。
alice_r 2018/03/07
HTML5

CSS
リンク
おじさんが若者たちにモテるためのモダンなHTML/CSSマークアップ
タイトルに含まれる語に関する補足おじさん：筆者の便宜上、30歳前後のフロントエンドエンジニア、マークアップエンジニア等を指す。性別は問わない。なぜ「モテ」なければいけないのか「モテる」とは、最先端の流行を知り取捨選択することで、自由意志を謳歌することで実現する。 PHPとjQueryの時代は廃れ始め、AngularやReactに代表されるUIフレームワーク、ES2015やTypeScriptを流暢に扱えることがフロントエンドの責務となり、HTMLやCSSも、EJSやPug・SassやPostCSSなどのトランスパイル言語を介すことがほぼ常識になってきた（と思う）。ところが、HTMLやCSSを何の言語で書くか以前に、中身をどうするべきかはあまり議論されていないので、「モテる」ための方法をいくつかかいつまんでまとめてみた。セマンティックなコーディングは、開発者の課題理解度を図り、意
alice_r 2017/05/22
HTML

CSS

HTML5
リンク
現場で使えるアニメーション系JSライブラリまとめ(2018年版) – TweenMax, CreateJS, WebAnimation, Velocityなど - ICS MEDIA
現場で使えるアニメーション系JSライブラリまとめ GSAP, CreateJS, WebAnimation, VelocityなどウェブサイトのインタラクションやUIの振る舞いなど、HTMLでモーションを実装する機会は多々あります。HTML要素の簡易的なアニメーションであればCSS Transitionを使ったことのある方も多いでしょう。しかし、WebGLやCanvas、SVGなどJavaScriptが実装の中心となる制作作業では、CSS Transitionでは対応しきれず、アニメーションライブラリ（トゥイーンライブラリとも言います）が必要となる場面があります。 JavaScriptのアニメーションライブラリは多種多様なので、どのライブラリを採用するのか悩みどころ。本記事ではHTMLのJavaScriptライブラリについて、使い勝手や書式を紹介します。今回紹介するメジャーなJSライブ
alice_r 2017/02/18
JavaScript

css

HTML5
リンク
input[type='date']の見た目をCSSで変更する - R42日記
Chromeでは、inputのtypeとしてdateやdatetimeを指定すると、ネイティブのdatepickerを使えるようになります。これまではjQuery-UIなどを使って実現していたわけですが、それがもう不要になるわけです。近い将来、他のブラウザでも対応されることは確実でしょう。しかしこのChromeネイティブdatepicker、見た目が若干よろしくありません。デフォルトではこんな感じになります。 …まあわからなくも無いですが、以下の点が気になります。 ”▼”が微妙。カレンダーのアイコンにすべき。「年」「月」「日」は不要。区切り文字のスラッシュとカレンダーのアイコンがあれば年月日の入力であることは自明。スピンボタンは邪魔。使う必要性が思い当たらない。最近、『いかに最小限の視覚要素で、ユーザーの認知を得るか』を考えることが、UIデザインであると思っています。というわ
alice_r 2016/05/30
CSS

HTML5

HTML
リンク
Web制作者は要チェックです！新バージョンのnormalize.css V4はモダンブラウザ・スマホ・HTML5に完全対応 | コリス
2016年3月19日に、モダンブラウザ、スマホ、HTML5に完全対応した「normalize.css」の新しいバージョン「normalize.css v4.0.0」がついにリリースされました！ v3から細かい改良が重ねられたv4で定義されている各スタイルが、どのように機能しているか紹介します。 normalize.css normalize.css -GitHub Changes to normalize.css normalize.cssの特徴 html, body, :rootなどの全体系の定義 HTML5の新要素用の定義リンク系の定義テキスト系の定義埋め込みコンテンツ系の定義グルーピングコンテンツ系の定義フォーム系の定義 normalize.cssの特徴 normalize.cssとはブラウザごとに異なる要素のスタイルの相違を吸収し、各要素のデフォルトのスタイルを提供する小
alice_r 2016/04/04
CSS

HTML5
リンク
WebクリエイタースクールデジタルハリウッドSTUDIO by LIG(デジLIG)
デジタルハリウッドSTUDIO by LIG（通称：デジLIG）は弊社LIGとデジタルハリウッドが業務提携し運営しているWebクリエイタースクールです。9万人以上のクリエイターを輩出する社会人向けプロ養成クリエイティブスクール・デジタルハリウッドのカリキュラムを提供します。
alice_r 2014/08/03
CSS

HTML5

JavaScript

SmartPhone
リンク
HTML5で組んでるならこの魔法のjsも入れておけっていう話
現在、A!@attripさん発で話題になっている「たった2行でIE5.5～IE8をモダンブラウザの挙動にする魔法のJS」という記事。 Webデザイン界隈では当たり前のものですが、実はもうひとつ追加しておくといいかもしれないjsがあったりします。 Photo:html5 By michael pollak IE8以前のブラウザはどうにもこうにも開発者泣かせなわけですが、ie9.jsとcss3-mediaqueries.jsを突っ込むことで、モダンブラウザと同じ挙動にすることができちゃいます。もう少し具体的に書くと、ie9.jsを組み込むことで、 position:fixed;に対応 max-width、max-heightに対応属性セレクタ、擬似クラスに対応 margin:0 auto;でのセンタリングに対応透過PNGに対応 opacityに対応といったことが可能になります。要はCS
alice_r 2012/12/08
CSS

CSS3

IE6

HTML5
リンク
1