Twitter ウィジェットを、CSSだけでデザインカスタマイズする方法 – LIQUID BLOG
公式のTwitter ウィジェットを、CSSだけでデザインカスタマイズする方法を紹介します。 Twitter ウィジェット：http://twitter.com/about/resources/widgets 上記のような公式プロフィールウィジェットについて、 CSSを追加するだけでいろいろなデザインカスタマイズをすることができます。 HTMLの解説 作成したウィジェットのコードをそのまま使用します。コードの改変は一切行いません。 管理しやすいように、idをtwitter_tickerとしたdivで囲みます。 </p> <p> CSSの解説 ストライプ背景を使用したデザインにしてみます。 デフォルトCSSが優先されないよう!importantを指定します。 border-radiusを0にして、丸角をなくします。 そして全体を囲むdiv、twtr-docに対して、ストライプの背景画像を指定
puzzel.jp
ユーザー目線でのデザインが得意で、プロダクトの成長をより加速させるためのデザインも得意です。 toC ユーザー向けのプロダクトのデザインを注力していましたが直近は、toB ユーザー向けのプロダクトのデザインに注力しています。 他、ロゴや Web サイトデザイン/マークアップ、写真撮影、映像撮影・編集、デザインの講師など。 自己紹介 (note) About - puzzel.jp 2010年10月からスタートした、puzzel.jp。 開設時から1つまえのサイトが残っています。 デザイントレンドによって変わっていたり、ガラケー対応のサイトだったりと、時代を感じることができます。 History: 2010, 2011, 2012, 2013, 2014, 2016, 2020 Chompy, Inc. 2021 - 2023 フードデリバリーサービス Chompy の UI / UX デザ
IEでCSSで指定してもフォントのサイズが小さくならない « ウップス!!なかわけ
こんにちは、なかわけです。 今日も仕事中に見つけたIEのこと。 取引先からもらったHTMLとCSSを元にコーディングをしていて、IEだけ文字が小さくならない不具合にぶつかりました。 なかわけがfont-size:10pxと書いた部分は小さくならず、取引先が書いたfont-size:77%は小さくなります。 取引先からもらったCSSにはこんな感じに書いてありました。 font-family:'Lucida Grande',Arial,Helvetica,'ヒラギノ角ゴ Pro W3','メイリオ','ＭＳ Ｐゴシック',sans-serif; font-size: x-small; line-height:1.2; どうやらfont-familyに日本語フォントより先に英字フォントを指定していると、 IEは指定されたフォントでは10pxにできないとご認識して10pxの文字指定を無視するようで
ページ毎のスタイルシート指定
header.phpに記載されているBODYタグですが、 <body <?php body_class(); ?>> こうなっていますか？ なっているなら、ブラウザでソースを確認してみてください。 bodyタグに固有のclassが吐き出されています。 大技を繰り出すまでもないなら、これで十分にページごと、カテゴリーごとのスタイルが付けられます。 私はページIDで付けると困る事があるので、スラッグ名をclassに表示するよう手を加えて スラッグでCSSの指定をしています。 ＞hihito様 早速に大変ありがとうございます！ すみません、よく飲み込めないのですが、 header.phpに<body <?php body_class(); ?>>を記載したとして、 このbodyタグに固有のclassとは、どこで設定されたものが吐き出されるのでしょうか？ で、その吐き出されたclassについてどの
人はなぜ角丸に魅かれるのか、その理由と角丸の効果的な使い方
ウェブのインターフェイスだけでなく、現実の世界でもたくさんの角丸を目にします。角丸は一時のトレンドではなく、デザインのスタンダードと言ってもよいでしょう。 そんな角丸がなぜ好まれるのか、どう使えばよいのか、ウェブページにどのように実装するのかなどを紹介します。 Rounded Corners and Why They Are Here to Stay 下記は各ポイントを意訳したものです。 角丸は目に、そして脳に優しい< 角丸のイメージは安心 -Appleのこだわり 角丸はいつ使用するべきか 角丸の実装：CSS3< 角丸の実装：古い方法 終わりに 角丸は目に、そして脳に優しい ビジュアル認知の権威：Jürg Nänni教授によると、『鋭角の長方形は同じ大きさの楕円より認知するのに努力を必要とする。人間の目は円形のものをより速く捉えることができる。」と述べています。 鋭角と角丸の視線の流れ 鋭
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
左側にスクロールバー 〜CSSテクニック〜