カテゴリ: CSS

[予告]9回目のSE勉強会@高蔵寺

764 回閲覧 このエントリーをはてなブックマークする この記事のブックマークユーザー 永続的リンク2008/06/17 22:53:02 カテゴリ: PHP, CSS, 勉強会
スポンサード リンク
SE勉強会ブログ



今週の日曜日に9回目が開催されます。


日時→2008年6月22日(日)10:00~
場所→株式会社一六社 本部事務所 (愛知県春日井市 高蔵寺駅前すぐ)


先ほど宿題を発表しました。
「おぉー♪」ってものは出来上がらないと思いますが、自分がほしいと思っているものを作ろうと思います。
 あと、他の人が作ってくるものにすごい期待してます♪どんなんかなー。


内容はSE勉強会ブログを参照ください。

 →ツイッターのフォローはこちら
スポンサード リンク
         

関連記事

CSSで3D効果を出す。

841 回閲覧 このエントリーをはてなブックマークする この記事のブックマークユーザー 永続的リンク2008/03/17 17:04:59 カテゴリ: CSS
スポンサード リンク

http://silverbackapp.com/

背景画像を重ねて3D効果を出しています。
簡単な方法ですが、こういうことを思いつく発想がすごいと思います。
 これをみると、ジブリアニメやディズニーアニメの演出方法を思い起こします。(自分だけ?)

 →ツイッターのフォローはこちら          

関連記事

第一回SE勉強会のレポート

971 回閲覧 このエントリーをはてなブックマークする この記事のブックマークユーザー 永続的リンク2008/03/04 18:44:41 カテゴリ: サーバー関係, ウェブ関係, PHP, CSS, JavaScript, Ajax, CakePHP
時間制限


 先日開催された第一回SE勉強会のレポートを書きそびれていましたので、まとめます。


 今回は、実力チェックってことであつさんが先生。
内容は、制限時間を設けてプログラムを書くというものです。内容はこちら


 こういうのは初めての体験でしたので、キンチョーした(汗)
冷静を装いつつも僕の心臓はバクバク×10!!
足はもう「生まれたての小鹿のよう」でした(笑)
でも、楽しかったのも事実。


こういう勉強会を通して自分のレベルをもっと上げていこうと思います。また色んな刺激を受けれるのは、やっぱおもしれーっす!
この勉強会は、参加自由!参加費無料!初心者も歓迎ですよ。もちろん上級者も!
お互いに刺激しあってレベルアップしてみませんか?
今後も開催される予定です。
PHP,Ajax,サーバー構築の勉強会に出席してみませんか?」を参照ください。

 →ツイッターのフォローはこちら          

関連記事

3カラム、2カラムのCSS(スタイルシート)のサンプル

13659 回閲覧 このエントリーをはてなブックマークする この記事のブックマークユーザー 永続的リンク2008/03/01 23:06:37 カテゴリ: ウェブ関係, CSS

YARETOKO「ヤレトコ」スクリーンショット

このサイトでは40種類の2カラム、3カラムのCSSレイアウトが紹介されています。


このブログは、フッター付き中央列が可変の3列スタイルシートにしています。
そのサンプルも含めていくつか紹介します。

基本のレイアウト

サンプルは、Header,Content,Navigation,Extra stuff,Footerの五つの要素を基本としています。

<div id="container">
  <div id="header">Header</div>
  <div id="wrapper">
    <div id="content">Content</div>
  </div>
  <div id="navigation">Navigation</div>
  <div id="extra">Extra stuff</div>
  <div id="footer">Footer</div>
</div>

CSSサンプル例


共通のスタイルシート

html,body{
    margin:0;
    padding:0;
    text-align:center
    }
div#header{
    position:relative
    }
div#footer{
    clear:both;
    width:100%;
    background: #333;
    color: #FFF
    }


3列(全て固定幅)

中央列=Content,左列=Navigation,右列=Extra Stuff
サンプル

div#container{
    width:700px;
    margin:0 auto;
    text-align:left
}
div#wrapper{
    float:left;
    width:100%
}
div#content{
    margin: 0 150px
}
div#navigation{
    float:left;
    width:150px;
    margin-left:-700px;
    background:#B9CAFF
}
div#extra{
    float:left;
    width:150px;
    margin-left:-150px;
    background:#FF8539;
}

3列(中央列可変・両サイド固定)

中央列=Content,左列=Navigation,右列=Extra Stuff
サンプル

div#wrapper{
    float:left;
    width:100%
    }
div#content{
    margin: 0 200px
    }
div#navigation{
    float:left;
    width:200px;
    margin-left:-100%;
    background:#B9CAFF
    }
div#extra{
    float:left;
    width:200px;
    margin-left:-200px;
    background:#FF8539
    }

2列(全て固定幅)

右列=Content,左列=Navigation,右列=Extra Stuff
サンプル

div#container{
    width:700px;
    margin:0 auto;
    text-align:left
    }
div#content{
    float:right;
    width:500px
    }
div#navigation{
    float:left;
    width:200px;
    background:#B9CAFF
    }
div#extra{
    float:right;
    width:500px;
    background:#FF8539
    }

2列(左列固定・右列可変)

右列=Content,左列=Navigation,左列=Extra Stuff
サンプル

div#wrapper{
    float:right;
    width:100%;
    margin-left:-200px
    }
div#content{
    margin-left:200px
    }
div#navigation{
    float:left;
    width:200px;
    background:#B9CAFF
    }
div#extra{
    float:left;
    clear:left;
    width:200px;
    background:#FF8539
    }


※実際に紹介されているサイトのCSSの、文字サイズや色など省略してあります。

 →ツイッターのフォローはこちら          

関連記事

CSSハックについてまとめてみた。

2126 回閲覧 このエントリーをはてなブックマークする この記事のブックマークユーザー 永続的リンク2008/02/22 05:58:05 カテゴリ: ウェブ関係, CSS
Firefox ロゴ

CSSコーディングをしている時によくあるブラウザごとのスタイルシートの解釈の違い。・・・ブラウザのバグ。
だから正しく書いても意図どおりに表示されないという現実。
Firefoxでは正しく表示されるのに、IEでみたら・・・・。IE7で見たらOKでIE6だと・・・・。


そんな時「IE6にだけ有効なcss」「FirefoxやSafariに・・・」と思いますよね。


こんな状況になったらCSSハックを使うという手があります。CSSハックはブラウザごとのバグや解釈の違いを逆手にとってブラウザごとの表示の違いを調整する方法です。

今回はその備忘録をかねてまとめてみました。

=> 続きを読む!

 →ツイッターのフォローはこちら          

関連記事

:: 次のページ >> ↑ページ上部へ

アクセスカウンター

今日 : 9 昨日 : 5

ブログ内容

YARETOKO「ヤレトコ」のトップページです。
メインはウェブ・サーバー、ブレイクダンス、旅行、おいしいお店のことなどを書いています。 他におすすめの書籍など。

プロフィール

MICK

MICKです。

1983年1月24日生まれ。ウェブの世界にいるのは、偶然のようで必然なのかも。

好きなこと :
 挑戦すること。物事に没頭すること。勉強すること。
嫌いなこと :
 自慢話を聞くこと。人の悪口を言うこと。

運営サイト

      

カテゴリ一覧

サイト広告

オススメの書籍とか

感想

紹介

色々

最近のコメント

最新記事

注目記事

人気記事

最近の人気記事

人気の記事

関連サイト

運営サイト

色々

最近のトラックバック