Pure CSSで実装するコーナーリボン - NxWorld
要素や画像の角などに配置するコーナーリボンを、画像は使用せずにCSSのみで実装してみたものです。 HTMLとCSSで実装する場合は幅や位置の指定が若干面倒に感じることはありますが、その分カラー変更等も容易で角度なども自由に変更できます。 イメージにあるように、作成するのは「左上」「右上」「左下」「右下」の4パターンのコーナーリボンとなります。 「左下」「右下」に表示しているものは意図的にテキストを逆さに表示させていますが、通常の見栄えで良いのであれば後述するコードのtransform: rotate();の値を変更してください。 ここでは実装のコードのみ紹介しているので、実際に表示を確認したい場合は以下デモで確認できます。 HTMLと共通CSS 紹介しているものは下記のようなHTMLを使用しており、共通のclassとして.ribbonを記述しています。 また、それに加えて例えば「左上」の場
CSSだけで三角形を作ろう！その2：吹き出しやリボンをデザインする | 株式会社グランフェアズ
こんにちは、めぐたんです。 前回は「CSSだけで三角形を作ろう！その1：borderプロパティの仕組みをマスター」と題して、なぜborderプロパティだけで三角形が作れるのか？どのような設定でどんな三角形ができるのか？を詳しく掘り下げてみました。 では、こうして作った三角形はWeb制作においてどんなときに活躍するのでしょうか？ よく見る利用例を挙げていきたいと思います。 はじめに：三角形を配置するポイント ご紹介するサンプルのラインナップは大きく分けて下記の3つです。 吹き出し ステップ表示 リボン風の装飾 上図のように、要素にくっつけて別の形を表現するという使い方が主だと思います。 この場合三角形自体にはコンテンツとして意味合いを持たないので、:beforeや:afterといった擬似要素として配置します。 また、位置調整のためのpositionプロパティも抑えておきましょう。 利用例1：
東京で暮らし、働くことの“コスト”は？地方在勤のススメ | AERA dot. (アエラドット)
移住促進イベント「地方移住クリエイターサミット in TOKYO」で登壇した経済ジャーナリスト・木暮太一氏この記事の写真をすべて見る 3月1日に、地方で働くことを考えるイベント「地方移住クリエイターサミット in TOKYO」が東京・竹橋にて開催された。同イベントは、移住促進政策に積極的な福岡市が主催する企画。北海道から沖縄まで地方で働くクリエイターを招き、地方で働くことに関するトークセッションなどが行われた。 イベント会場に足を運んだ人は約１００名。クリエイター向けの移住促進イベントということもあり、参加者はグラフィックデザイナーや建築デザインを手がけるフリーランサーなど。職業柄、移住のしやすい人が集まった。 イベントには、経済ジャーナリストの木暮太一氏が登壇。地方移住のススメをこう説いた。 「多くの方は、『仕事』を考えるとき年収にしか目を向けていません。それに対する労力や生活費、ストレ
家は3坪、生活費は月2万円 路上生活を経て行きついた身軽な“小屋”暮らし〈AERA〉
【小屋ブームの火付け役】Ｂライフ 高村友也（たかむら・ともや）さん／１９８２年、静岡県生まれ。東京大学哲学科卒業、慶應義塾大学大学院（哲学専攻）博士課程単位取得退学。２００９年、小屋を建てる（写真：本人提供）Ｂライフ を送る高村さんの小屋（写真：本人提供） 小屋内部・台所（写真：本人提供） 小屋内部・テーブルと薪ストーブ（写真：本人提供） 好きな時間に起きて、好きな時間に寝る。欲しかったのは例えば、そんなささやかな自由。しかし社会人ともなると、至難の業だ。仕事がある。生活費を稼がないといけない。でも視点を少しずらせば、それが可能になることを「発見」した人がいる。高村友也さん（36）だ。その答えは「小屋」にあった。 【写真】高村さんの小屋の外観や内観はこちら 小屋ブームの火付け役のひとりともいえる高村さん。これまであまりメディアに出ることがなく、今回、小屋を訪ねることはかなわなかったが、取材
バンコク・ドンムアン空港のお土産情報【2019年】｜サクのバンコク生活日記
海外旅行中のミッションの一つに、日本にいる家族や友人にお土産を買うことがあります。 それはそれで旅の楽しみの一つではありますが、観光中になかなか時間がとれなかったり、うっかり買い忘れることもありますよね。 そんな時に頼りになるのが空港のお土産ショップです。空港でどんなお土産が買えるのかあらかじめ把握しておけば、安心できるはず。 そこで今回は、エアアジアなどのLCC（ローコストキャリア）が多数発着するバンコクのドンムアン空港のお土産情報をまとめました。 ドンムアン空港には国際線のターミナル1と国内線のターミナル2があって行き来可能なのですが、今回はターミナル1（国際線）にしぼって紹介したいと思います。 バンコク・ドンムアン空港利用ガイド2019～両替・SIM・タクシー・お土産～ 日本からエアアジアやノックスクートなどのLCC（ローコストキャリア）を利用してタイ・バンコクに向かった場合に降り立
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
オバさん「救急隊員がコンビニに入ることはどうかな、購入は控えたほうがいい」飲み物を買うことすら快く思わない不寛容な人が話題に