BootstrapをWordPressで試す

今更ながらBootstrapを色々と触ってみたので投稿をする。

比較のために他のCSSフレームワークも触ってみようと思い、
HTML KickStartも試してみたが今回はイマイチだった。

というのも既存のCSSと喧嘩しすぎてしまい修正が面倒だったので
今回(WPのTwentyEleven)は適さないが別の機会では使ってみたい。

Bootstrapは微調整のみで追加する事ができた。
せっかくなので下記にいくつか載せてみる。

 

Pタグ、classで色分け

Fusce dapibus, tellus ac cursus commodo, tortor mauris nibh.

Etiam porta sem malesuada magna mollis euismod.

Donec ullamcorper nulla non metus auctor fringilla.

Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis.

Duis mollis, est non commodo luctus, nisi erat porttitor ligula.

[HTML]

Fusce dapibus, tellus ac cursus commodo, tortor mauris nibh.

Etiam porta sem malesuada magna mollis euismod.

Donec ullamcorper nulla non metus auctor fringilla.

Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis.

Duis mollis, est non commodo luctus, nisi erat porttitor ligula.

[/HTML]

 

blockquoteタグ

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
Someone famous Source Title

[HTML]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
Someone famous Source Title

[/HTML]

 

tableタグ、1行おきにストライプ

# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter

[HTML]

# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter

[/HTML]

 

input type text、フォーカスすると柔らかく光る

[HTML]

[/HTML]
 

buttonタグ








[HTML]








[/HTML]
 

奇をてらうデザインは必要なくて、
シンプルに見栄えを良くし手間もかけない、

とても良いですね。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です