はてなブックマーク人気エントリウィジットをサイドバーに適合させる - 情報学の情緒的な私試論β
2013-08-03 はてなブックマーク人気エントリウィジットをサイドバーに適合させる ウェブサービス はてなブックマーク人気エントリウィジットがダサい 『はてなブックマークブログパーツ』にある、はてなブックマーク人気エントリウィジットを使いたかったのですが、デザインが気に入らなかったので断念していました。 オリジナルスタイルシートを適用 しかし、「テーマ」欄を「なし」にすることでオリジナルのスタイルシートが適用できるようになります。 スタイルシートを自由にできるとはいっても、セレクション名が明記されておらず、途方にくれてしまいます。デフォルトで配置するとブックマークユーザー数の文字色すら変わりませんし。 これについての『はてブのブログパーツを自分のブログデザインに合わせる方法 | Backless -バックレス-』というサイトに解説がありました。「B」アイコンとか要らなかったのですが、そ
擬似要素を使った見出しデザイン
このブログの見出しはシンプルなんですが、CSSの「:before」や「:after」など擬似要素を使えば色々と装飾ができますので今回は8つのサンプルを紹介します。 HTMLはすべてHタグだけです。特に意味はありませんが今回のサンプルはh4タグを使っています。 「:before」「:after」やボーダーで表現する三角形の使い方など慣れない方もいるかもれませんので、その都度簡単に解説していきます。「:before」「:after」疑似要素はIE7以下は非対応ですのでご注意ください。 今回のサンプルは別サーバにアップしていますのでご覧ください。 それでは今回8つのサンプルを紹介していきます。 1. 吹き出しのような見出し1 吹き出しの下の部分を:after擬似要素で作っています。三角形はボーダーで作っています。下の画像を見ると何となくイメージできるでしょうか。今回の場合は上の赤い部分のみ色を付
HTML5 基礎知識 - web探検隊
HTML5を書くための基礎知識をメモHTML5の雛形XHTML5ではなくてHTML5のマークアップについて html> head> title>HTML5 基礎知識title> meta charset="UTF-8"> head> body> body> html> HTML5の新要素 文章構造に関するものsection汎用的なセクション。文章のアウトラインを構成する。articleセクションの一種で、Webページから独立したコンテンツを表す。asideセクションの一種で、外側のセクションに対する補足情報を表す。navセクションの一種で、外側のセクションに対するナビゲーションメニューを表す。footerセクションのフッター。headerセクションのヘッダー。hgroup複数の見出し(h1-h6)をまとめる。 外部コンテンツの埋込みfigureキャプションを伴うような内容のものを文章中に埋
スタイルシートリファレンス（ABC順）
background …… 背景に関する指定をまとめて行う background-attachment･･･背景画像の固定・移動を指定する background-color …… 背景色を指定する background-image …… 背景画像を指定する background-position …… 背景画像の表示開始位置を指定する background-position-x …… 背景画像の横位置を指定する（IE独自の仕様） background-position-y …… 背景画像の縦位置を指定する（IE独自の仕様） background-repeat …… 背景画像のリピートの仕方を指定する behavior …… 外部スクリプトを適用する（IE独自の仕様） border …… ボーダーのスタイル・太さ・色を指定する border-bottom …… 下ボーダーのスタイル・太さ・色
スタイルシートリファレンス（目的別）
font …… フォントに関する指定をまとめて行う font-style …… フォントをイタリック体・斜体にする font-variant …… フォントをスモールキャップにする font-weight …… フォントの太さを指定する font-size …… フォントのサイズを指定する font-family …… フォントの種類を指定する font-size-adjust …… フォントのサイズを調整する font-stretch …… フォントを縦長・横長にする line-height …… 行の高さを指定する text-align …… ブロックコンテナ内の行の揃え位置・均等割付を指定する text-justify …… 均等割付の形式を指定する vertical-align …… 縦方向の揃え位置を指定する text-decoration …… テキストの線・色・スタイルをまと
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
