【HTML5】新規でサイトを作るのに使えそうなの一式。Ver 1
HTML5版の新規でサイトを作るのに使えそうな一式です。 今までの新規で使えそうな一式のVer3からも有る程度流用はしていますが、結構いじってます。 今までみたいに、社内のマークアップエンジニアとかそういう人がもう居ない環境なので、何処かで使われていた訳ではありませんが、まー最初の準備って地味に面倒なのでちゃちゃっと始めるには良いんじゃないでしょうか。 【HTML5】新規でサイトを作るのに使えそうな一式。Ver 1をDL（zip：12kb） HTML5版のVer 1を見る 社内のマークアップエンジニアとかって書いたら、これどうなのよ？とか話してた頃がちょっと懐かしくなった。 コーダー飲みとか、CSS Niteなんかで、マークアップエンジニアやコーダーさんと会う機会は結構有るのに、そういう具体的な？話まではしないからなぁ・・・ それはさておき、中身のご説明などを続きにて。 中身のご説明 zi
少しのコードで実装可能な20のCSS小技集
少しのコードで実装可能な20のCSS小技集CSSハックに続き、このCSS小技集も私のブックマークにずらりと並んでいたので、整理も兼ねて記事にしてみました。CSSのお勉強を始めたばかりの頃にブックマークしておいたものも多数。。ということで初心者さんからベテランさんまで参考にしてみてください！ コードはサンプル内の「HTML」や「CSS」タブをクリックしてくださいね！ 少しのコードで実装可能な CSS 小技集 シリーズ【第 2 弾】少しのコードで実装可能な 20 の CSS 小技集【第 3 弾】少しのコードで実装可能な 15 の CSS 小技集まずは CSS 基礎編1. div を中央揃えにするほとんどのサイトが基準となる div を画面の中央揃えに設定しています。左右の margin を auto にして中央揃えに。 3. 複数のクラスを指定実はクラスは一度に複数指定できます。スペースを空け
覚えて良かったCSSテクニック « zaru blog
ここ最近、覚えてよかったなーと思ったCSSテクニックをまとめてみる CSSテクニックは時代とともに変わっていくけれど、ここ1年ほどスタメンレベルで使うCSSテクニックが絞られてきたので、ここらでちょっと個人的にもまとめておこうかと。 liボックス 幅：190px マージン：15px liボックス ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。 liボックス ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。 <li>にはクラスを指定せずに、左右にぴったりくっ付くように配置が可能。 <style type="text/css"> #box1{ width: 600px; } ul{ width: 615px; margin: 0 -15px 0 0; overflow: hidden; _zoom: 1; font-size:7
JavaScript使ってないのに使ってる風のピュアCSSなテクニック集:phpspot開発日誌
30 Pure CSS Alternatives to Javascript - Speckyboy Design Magazine JavaScript使ってないのに使ってる風のピュアCSSなテクニック集。 最近ではCSS3等の登場によってCSSだけでもかなり高度なことが出来るようになっていますが、それらのコレクションがまとまっていました。 CSSだけでもこれだけのことが出来るという可能性を知るのに調度良いです。 マウスオーバーでハイライトする地図 タイムライン LightBoxもCSSで コンテンツスライダー スピーチバブル 無理してCSSのみにこだわる必要はありませんが、楽な選択肢を取れるなら覚えておいて損はありませんね。 関連エントリ ピュアCSSで実装された吹き出しのデザイン例色々 ピュアCSSで画像を壁に貼ったポラロイドギャラリー風にするサンプル クリーンなデザインでピュアＣＳ
GoogleにホスティングされているjQuery等の便利JSタグを一瞬でコピーできる便利サイト「ScriptSrc.net」:phpspot開発日誌
GoogleにホスティングされているjQuery等の便利JSタグを一瞬でコピーできる便利サイト「ScriptSrc.net」 2010年04月28日- jQuery google api and other google hosted javascript libraries. - ScriptSrc.net GoogleにホスティングされているjQuery等の便利JSタグを一瞬でコピーできる便利サイト「ScriptSrc.net」。 jQueryを使うサイトでは、通常、自分のサーバにjQueryをアップロードして、<script>タグ書いて、srcでその位置を指定して、なんていう面倒なステップを踏むわけですが、このサイトにアクセスしてボタンを１回おせば、利用用のタグがクリップボードにコピーされます。 コピー例：<script type="text/javascript" src="htt
VegaBit.com is for sale | HugeDomains
Working with hugedomains.com was a quick and easy process. We got to speak to multiple real people located in Colorado without having to wait on hold! Our only complaint was we felt we had to overpay more than this particular domain was worth, and we weren't able to negotiate it down to a level that we felt was fair. However, payment and delivery were seamless, and within a few hours we had all of
Awesome Bubble Navigation with jQuery | Codrops
In this tutorial we are going to create a bubbly navigation with jQuery. The idea is to have some round navigation icons that release a bubble when hovering over them. We will use the jQuery Easing Plugin for a even nicer effect. Ok, so let’s get started. The Markup The HTML will consist of a main div that we will give the class navigation and the id nav. Inside of the main div we will have the na
HTML5 / CSS3のソースがダウンロードできるサンプル – creamu
HTML5 / CSSでできることをざっくり掴みたい。 そんなときに参考になるのが、『Create An Elegant Website With HTML 5 And CSS3』。HTML5 / CSS3のソースがダウンロードできるサンプルです。 HTML5で使われる<section>や<aside>、<header>、<footer>などの各タグの解説と、CSSにおける「RGBa」、「box-shadow」、「border-radius」、「text-shadow」などのプロパティーの解説がされています。 デモは以下から。 Download Source ソースのダウンロードも提供されているので、参考に見てみてはいかがでしょうか？ Touch The Future: Create An Elegant Website With HTML 5 And CSS3 あることが一つ決まった。と
Experiment: CSS3 Accordion — Paul Hayes
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
NealGrosskopf.com l Create a JQuery Content Slider Using Pure CSS - Demo
2 2 1 3 2 4 3 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam id magna. Maecenas metus. Nunc dignissim rhoncus neque. Vestibulum leo nibh, suscipit ac, tempus nec, sollicitudin et, erat. Mauris neque purus, tincidunt ac, luctus a, sagittis eu, nisi. Morbi quis neque id elit facilisis ullamcorper. Cras id arcu. In quam orci, accumsan ut, porttitor in, malesuada vitae, eros. In auctor
CSS Tabs
Example One Grade: C From an HTML perspective, this is the absolute cleanest. It just doesn't deal with current navigation highlighting. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam tincidunt mauris eu risus. Vestibulum auctor dapibus neque. Feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris
CREAMU
art direction & design: Kunitaka Kawashimo code, interaction & photography: creamu Inc. Monthly Archive 2025年9月 (2) 2025年8月 (2) 2025年7月 (11) 2025年6月 (6) 2025年5月 (6) 2025年4月 (7) 2025年3月 (4) 2025年2月 (3) 2025年1月 (6) 2024年12月 (6) 2024年11月 (4) 2024年10月 (7) 2024年9月 (3) 2024年8月 (4) 2024年7月 (2) 2024年6月 (1) 2024年4月 (1) 2024年3月 (4) 2024年2月 (2) 2023年12月 (10) 2023年10月 (1) 2023年9月 (2) 2023年8月 (4) 2023年7月 (5) 2
IE 6で泣かないための、9つのCSSハック (1/3) - ＠IT
有限会社タグパンダ 喜安 亮介 2009/10/8 Webブラウザごとのレンダリングエンジンの違いにより起こるレイアウトの表示ずれ問題に泣かされるWebデザイナのために、Webブラウザごとに使えるかどうかの表を交えながら問題を解決するためのCSSハック＆フィルタTipsをお届けします（編集部） 最も多く使われているのに……、いや、だからこそ 多くのWebデザイナの悩みの1つは、レイアウトの表示ずれ問題だと思います。これは、各Webブラウザが採用しているレンダリングエンジンの違いから起因している場合が多いです。その中でも、最もWebデザイナ泣かせのWebブラウザなのは、マイクロソフトが開発しているIE（Internet Explore）のバージョン6です。 IE 6は、発売開始当初のWindows XPにデフォルトでインストールされていたWebブラウザということもあり、世の中の多くのユーザー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML5を使ったドロップダウンメニュー – creamu
ピュアCSS3で3Dアニメーション:phpspot開発日誌
綺麗にデザインされたCSS3ボタンのまとめ:phpspot開発日誌
http://www.growldesign.co.uk/projects/lb/
CSSのrotationを使った時計「CSS Clock」:phpspot開発日誌
phpspot開発日誌 - PHP/Ajax/JavaScript/CSS等の最新技術情報をお届け
The W3C Markup Validation Service