写真画像にインスタ映えするフィルタを適用するスタイルシートを紹介します。 使い方は簡単で、外部スタイルシートと画像にclassを加えるだけでOKです。 42種類のフィルタが用意されており、どのフィルタでも簡単に利用できます。
![簡単なのにすごい!普通の写真をインスタ映えする写真にできるスタイルシート -Instagram.css | コリス](https://cdn-ak-scissors.b.st-hatena.com/image/square/0b7ce38272dfea2fbbe57601f73a1fd0cc3e57a4/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201801%2F2018010701.jpg)
CSS Gridは今までに出来なかったレイアウトを実装するだけでなく、既存レイアウトをより簡単に実装する能力も備えています。サポートブラウザも十分になり、そろそろ既存レイアウトの実装方法を見直すタイミングかもしれません。 CSS Gridを使用して、3カラムや画像ギャラリーやカード型など、レスポンシブ対応のレイアウトを実装するテクニックを紹介します。 Common Responsive Layouts with CSS Grid by @samsunginternet 下記は元記事のデモをピックアップしたものです。 ※作者様にライセンスを得て掲載しています。 CSS Gridで実装するヒーローイメージを備えた、3カラムのレイアウト CSS Gridで実装する画像ギャラリーのレイアウト CSS Columnで実装するカード型レイアウト CSS Gridで実装するヘッダ・フッタ付きの3カラムの
JavaScriptの有用なコードのスニペットをまとめたサイトを紹介します。 一つひとつは30秒ほどで理解できるコードとなっており、膨大な数のスニペットがまとめられています。あれなんだっけ? という時に、便利ですね。
2018年1月末のアップデートで、ついにPhotoshopでもAdobe Senseiが実装され、複雑な選択範囲が1クリックで簡単に作成できるようになりました。 紹介記事: Photoshopの選択範囲の作成が驚くほど簡単に PhotoshopやIllustratorなどに実装が予定されているAdobe Senseiの機能を紹介します。Adobe Senseiの主な役割は作業的な部分の効率化で、これにより人はよりクリエイティブな部分に時間を割くことができます。 Adobe Sensei|AI(人工知能) Top 11 Tech Sneak Peeks from MAX 2017 that Wow'ed ※記事の掲載にあたり、Adobe広報様に許可を頂いています。 Adobe Senseiが最適な画像を見つけ出す -SceneStitch Adobe Senseiがデザインの要素を認識する
Result マウスホバーしてるところ以外をぼかしてホバー中のコンテナをハイライトする、みたいなの。 この手の手法とコードはほぼ同じです。 csstable {/*table全体*/ background: #f5f5f5; border-collapse: separate; font-size: 12px; line-height: 24px; margin: 30px auto; text-align: left; } th { background: #444; color: #fff; font-weight: bold; padding: 10px 15px; position: relative; } td { border-bottom: 1px solid #e8e8e8; padding: 10px 15px; position: relative; transitio
Result jQuery$("#myTable").on('input', '.txtCal', function () { var calculated_total_sum = 0; $("#myTable .txtCal").each(function () { var get_textbox_value = $(this).val(); if ($.isNumeric(get_textbox_value)) { calculated_total_sum += parseFloat(get_textbox_value); } }); $("#total_sum_value").html(calculated_total_sum); });複数inputに入力された数値の合算を出します。 簡易的な見積もりとかデータを扱う時に使えそうでしょうか html<table id="myTabl
2018年1月16日 Webサイト制作, 便利ツール 普段使っているChromeをより便利にしてくれる拡張機能。私も様々なものを入れていますが、その中でもWeb制作時に使える便利拡張をいくつか紹介します。Firefoxに対応しているものもありますよ! ↑私が10年以上利用している会計ソフト! Web Developer Chrome拡張|Firefox Add-on|GitHub|公式サイト Webに携わる人は入れておいて損はない拡張のひとつ!長年利用させていただいてます。1クリックでCSSやJavaScriptを無効化したり、画像の非表示、様々なデバイスサイズでの表示、クラスやID名の表示、定規やカラーピッカーまで揃っています!カラーピッカーはCSSで定義されたものだけでなく、画像からも抽出できるのがすごい。日本語版もあるので試してみてくださいね。 CSS Peeper Chrome拡張
商品に関わるひとの愛情がこもった、思わずパケ買いしたくなる、2017年の素敵パッケージデザインをまとめてご紹介します。見ているだけでも楽しいデザインの裏には、さまざまなパッケージに対する思いやコンセプトが詰まっており、デザイントレンドを知るのにもぴったりです。 パッケージデザイン世界一を決める!ペントアワード2016の素敵な受賞作品まとめ 2017年に人気だった素敵なパッケージデザイン厳選55個まとめ SAIKAI スウェーデンと日本の学生によって作成された、スウェーデン市場を想定した日本のせんべいと煎茶のセット。 Kuber 数あるポークソーセージの中でも、消費者に有効的にアピールできることを目標に作成されたかわいいパッケージ。 Geniled Bright Led Bulbs 電球のカタチが洋梨に似ているということではじまった、ロシア初のLEDライト用パッケージデザイン。 Perana
ふんわりと優しい印象をあたえてくれる水彩画。グリーティングカードや招待状にはもちろん、Webサイトなどにあしらうと雰囲気のあるデザインになります。そんな時に活躍してくれるのが今回紹介する、動物や花でおしゃれにデザインを演出できる水彩イラストセット「Mystical Winter Watercolor Set」です。 シックで落ち着いたカラーで描かれた、クオリティの高いイラストセットです。 詳しくは以下 多彩な色使いで描かれたイラストは落ち着いた雰囲気でとてもおしゃれな印象。オリジナルのグリーティングカードや、結婚式の招待状に動物をあしらったデザインをしてみるのも粋な演出になりそうです。イラストセットの中には、動物だけでなく花やリース、キャンドルなどの冬をイメージした素材が豊富に揃っています。中にはパターンになったデータもありますのでプレゼントのラッピングにしてみたり、幅広く活用できるアイテ
TOP > Design , Tool > フリーで使えるPSDモックアップテンプレート「Free PSD Mockup Templates (32 Fresh Mock-ups)」 Webサイトやアプリの制作はもちろん、商品パッケージなどにもモックアップが活用されます。完成のイメージを視覚的に確認するために使われ、クライアントへの提案などには欠かせないアイテムです。今回は、フリーで使えるPSDモックアップテンプレート「Free PSD Mockup Templates (32 Fresh Mock-ups)」を紹介したいと思います。 Stationery MOCK-UP on Behance オフィスツールからPC、スマートフォン、パッケージ用まで様々なモックアップが集約されたサイトです。 詳しくは以下 Carved Stone Logo Mockup PSD – Graphic
2018.01.10 15:30 いつまでもポリコレと言ってれば済むと思うなよ!~映画のキャスティングと人種や性別 このところ、ハリウッド映画では以前よりもいろいろな人種の役者を起用したり、女性を増やしたりするキャスティングが盛んです。例えば『スター・ウォーズ』新シリーズやマーベル・シネマティック・ユニバースの新作では、女性や非白人の登場人物が増えています。そしてそうした映画が公開されるたびに起こるのが、「ポリコレ」的配役だという感想です。 このような文脈で「ポリコレ」という言葉が使われる場合、おそらくキャスティングする側に何らかの「配慮」が働いているという考えが背後にあることが多いかと思います。つまり、何も「配慮」せずに配役を行った場合、プロデューサーや監督はほぼ全員を白人にし、男性をメインに据え、男女問わず容姿の良い役者で揃えるという想定があるでしょう。そこに「ポリコレ的配慮」を入れる
お金持ちはどう考え、どう選択する? 「今もらえる100万円」と「1年後にもらえる105万円」。あなたならどちらを選ぶだろうか? 実は、この問いにお金持ちになるためのヒントが隠されている。お金持ちになる人は、どのように考え、どちらを選択するのかを見ていこう。 お金に働かせ、資産を積み重ねるというお金持ちの考え方 お金には時間価値がある。例えば、今の金利が年率5%だとすると、現在の100万円は1年後には105万円になる。100万円が現在価値で、1年後の105万円は将来価値、5万円は時間価値である。その5%をファイナンス理論では割引率とも言う。 ところが今は低金利の時代。日銀はゼロ金利政策をとっている。ゼロ金利では1年後の理論価値も100万円。「1年後の105万円」を選ぶのが、ファイナンス理論的には合理的な考え方である。ゼロ金利でお金を借りて、1年後の105万円に投資すれば、ほぼノーリスクで5万
林雄介・新刊『読むだけで神になれる本』(林雄介、青林堂) @yukehaya バチカン(スイス人の傭兵は雇用している)やリヒテンシュタインのように自前の軍隊を持たない国もありますが、バチカン等の攻略のためにはイタリアを攻撃する必要があり、リヒテンシュタインはスイスに外交、防衛を委託しており、何らかの形で防衛力は全ての国家が保有しているのです。 2018-01-03 13:38:51
サービス終了のお知らせ SankeiBizは、2022年12月26日をもちましてサービスを終了させていただきました。長らくのご愛読、誠にありがとうございました。 産経デジタルがお送りする経済ニュースは「iza! 経済ニュース」でお楽しみください。 このページは5秒後に「iza!経済ニュース」(https://www.iza.ne.jp/economy/)に転送されます。 ページが切り替わらない場合は以下のボタンから「iza! 経済ニュース」へ移動をお願いします。 iza! 経済ニュースへ
[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。 もう10日ですが、明けましておめでとうございます。今年もよろしくお願い致します。「調べるお」の新年一発目といえば「渋谷地図」です。※今回も「オフィスビルの入居テナントについて調べるお」さんの情報もかなり参考にさせていただきました。いつかお会いしたい...。 【過去の渋谷地図】 ・2017年1月の渋谷ネット系ベンチャー地図 ・2016年1月の渋谷ネット系ベンチャー地図 ・2015年1月の渋谷ネット系ベンチャー地図 ・2014年1月の渋谷ネット系ベンチャー地図 ・1999年(ビットバレー)頃の渋谷ネット系ベンチャー地図 ずっと再開発してる渋谷ですが、一部では変化も見られるようになりました。明治通りからキャットストリートに行く道の角に新しくできたのが「渋谷キャスト」。ネット系ではLUX
2017年12月25日、プログラミング言語Rubyの新バージョンである「Ruby 2.5」が公開された。Rubyの新バージョンは例年、クリスマスにリリースされる。翌日の26日には「Ruby 2.5リリースパーティー」が開かれ、Rubyの開発者(コミッター)がRuby 2.5の改善点を披露した。 Ruby 2.5の最大の特徴は処理の高速化。様々な箇所が高速化のために改良されている。また、2020年のリリースを目指している「Ruby 3.0」の機能を実現するための準備も同時に実施しているという。 冒頭ではRubyのオリジナルの開発者であるまつもとゆきひろ氏がテレビ電話で参加。開発がリリースのギリギリまで続いてしまった点を反省した。「せめて11月までにまとめておくべきだった」(同氏)。また、クリスマスリリースはプレゼントという意味があるものの、家族を持つコミッターが増えてきたため、「少し前の22
ReactStudioを使ったアプリの作り方はこちら React Studioを使ってQiitaの記事一覧アプリを作成してみる はじめに reactというとJSXの書き方、props、stateの挙動等を覚える必要があるため、 学習コストが割りと高めであったり、環境を構築するのに一手間かかったり等、 まだまだとっつきにくさが否めないライブラリです。 しかし、今回は、そんなReactをドラッグ&ドロップでアプリが 作れてしまうツールがあったので紹介したいと思います。 ※尚、Windowsはなく、Macのみで使用できるツールでございますので、予めご了承下さい。 公式サイト 公式サイトへのURLはこちら。 React Studio https://reactstudio.com/ ツールの使い方 ReactStudioでコンポーネントをデザインします。 その後、コードが自動生成されます。 無料で
お久しぶりです。 今日は技術的な話題では無いですが、社外・社内にメールを出す時のテンプレ的なものを紹介したいと思います。 初めに言いますが、クッッソどうでも良い話題です。面接のスーツに何を着るかぐらいどうでも良い話です。 ただ、学生だと志望会社にメールを出すときに変に文面悩んだり、エンジニアだと社外にメール出す経験があまり無くて変に文面悩んだりとか、ここで悩むのは更に無駄なので、 ニートという身軽な身分のうちに、日本の会社で大体OKっぽいメールの書き方を適当に紹介します。 アホらしいですがメールの行間から仕事慣れてない感がでるとマイナス印象になったりもするので、それっぽいメールの書き方は知っておいて良いかもしれません。 自分もコンサルの新卒の時にいきなりクライアントにメールするのは怖かった記憶があるので、自分が学生の時に知りたかった内容的なのを書いておきます 業務メール書き方チートシート
1/11 00:30くらい追記 ブコメやトラバありがとうございます。 知らなかった知見がたくさん手に入り、増田を書いた甲斐がありました。 いくつか誤りの指摘をもらったので修正します。 あと、「個人的にイラッと来る文体だし」と言われて悲しいので追記分については文体も変えます。 方針・手間をかけない ・金もかけない ・毎日食っても病気にならない程度には栄養に気を配る ・味は気にしない 材料炭水化物・米 まとめて炊いて冷凍する。 ・パスタ 電子レンジでゆでる奴があれば手軽。 おかずをどうするか問題。 (1/10 追記)パスタと一緒に野菜を茹でれば良いとの知見が。 ・うどん 調理は楽。スーパで20円とかの奴はわりと足が速い。 ・パン 安く手に入れる手段を知らない。 野菜・もやし 安い。年中手に入る。下準備が要らない。炒めてもゆでても良い。栄養価も悪くない。すごい。 (1/10 追記)しかし足が早い
コンテンツブロックが有効であることを検知しました。 このサイトを利用するには、コンテンツブロック機能(広告ブロック機能を持つ拡張機能等)を無効にしてページを再読み込みしてください。 ✕
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く