1pxの神さま http://1x1px.net デザイナーのためのサイト Sat, 13 Nov 2010 21:47:57 +0000 ja hourly 1 http://wordpress.org/?v=3.0.1 1px欠けの角丸ボックスをCSSだけで作る方法 http://1x1px.net/web%e5%88%b6%e4%bd%9c/2010-11-14/1px%e6%ac%a0%e3%81%91%e3%81%ae%e8%a7%92%e4%b8%b8%e3%83%9c%e3%83%83%e3%82%af%e3%82%b9%e3%82%92css%e3%81%a0%e3%81%91%e3%81%a7%e4%bd%9c%e3%82%8b%e6%96%b9%e6%b3%95/ http://1x1px.net/web%e5%88%b6%e4%bd%9c/2010-11-14/1px%e6%ac%a0%e3%81%91%e3%81%ae%e8%a7%92%e4%b8%b8%e3%83%9c%e3%83%83%e3%82%af%e3%82%b9%e3%82%92css%e3%81%a0%e3%81%91%e3%81%a7%e4%bd%9c%e3%82%8b%e6%96%b9%e6%b3%95/#comments Sat, 13 Nov 2010 21:37:08 +0000 admin http://1x1px.net/?p=92

角丸なボックスは印象が柔らかくなるので是非とも取得しておきたいテクニック。
webbibo様のサイトで紹介されていたのでここでも紹介したいと思います。
参考にしたページhttp://www.webbibo.com/blog/htmlcss/1pxcorner.html

デモページ

HTMLでの記述


<div class="outer">
    <div class="inner">1px のボックス</div>
</div>

CSSでの記述

ボックスにボーダーを付けない場合


.outer {
    margin: 0px 1px;
    padding: 1px 0px;
    background: #cccccc;
}

.inner {
    margin: 0px -1px;
    background: #cccccc;
}

ボックスにボーダーを付ける場合


.outer {
    margin: 0px 1px;
    background: #eeeeee;
    border-top: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
}

.inner {
    margin: 0px -1px;
    background: #eeeeee;
    border-left: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
}

こんな記事も読まれています

  • おすすめの記事がありません
]]> http://1x1px.net/web%e5%88%b6%e4%bd%9c/2010-11-14/1px%e6%ac%a0%e3%81%91%e3%81%ae%e8%a7%92%e4%b8%b8%e3%83%9c%e3%83%83%e3%82%af%e3%82%b9%e3%82%92css%e3%81%a0%e3%81%91%e3%81%a7%e4%bd%9c%e3%82%8b%e6%96%b9%e6%b3%95/feed/ 0 変な鳥から高速でモナリザを描く動画 http://1x1px.net/%e3%81%8a%e3%82%82%e3%81%97%e3%82%8d%e3%83%8d%e3%82%bf/2010-10-31/%e5%a4%89%e3%81%aa%e9%b3%a5%e3%81%8b%e3%82%89%e9%ab%98%e9%80%9f%e3%81%a7%e3%83%a2%e3%83%8a%e3%83%aa%e3%82%b6%e3%82%92%e6%8f%8f%e3%81%8f%e5%8b%95%e7%94%bb/ http://1x1px.net/%e3%81%8a%e3%82%82%e3%81%97%e3%82%8d%e3%83%8d%e3%82%bf/2010-10-31/%e5%a4%89%e3%81%aa%e9%b3%a5%e3%81%8b%e3%82%89%e9%ab%98%e9%80%9f%e3%81%a7%e3%83%a2%e3%83%8a%e3%83%aa%e3%82%b6%e3%82%92%e6%8f%8f%e3%81%8f%e5%8b%95%e7%94%bb/#comments Sun, 31 Oct 2010 09:09:22 +0000 admin http://1x1px.net/?p=86

高速でモナリザを描いていく動画です。

絵を見て描いているにしても・・・すごい。

こんな記事も読まれています

]]> http://1x1px.net/%e3%81%8a%e3%82%82%e3%81%97%e3%82%8d%e3%83%8d%e3%82%bf/2010-10-31/%e5%a4%89%e3%81%aa%e9%b3%a5%e3%81%8b%e3%82%89%e9%ab%98%e9%80%9f%e3%81%a7%e3%83%a2%e3%83%8a%e3%83%aa%e3%82%b6%e3%82%92%e6%8f%8f%e3%81%8f%e5%8b%95%e7%94%bb/feed/ 0 無料のハイクオリティーアイコンを検索できるサイト http://1x1px.net/%e7%94%bb%e5%83%8f%e3%83%bb%e3%82%a4%e3%83%a9%e3%82%b9%e3%83%88/2010-10-31/%e7%84%a1%e6%96%99%e3%81%ae%e3%83%8f%e3%82%a4%e3%82%af%e3%82%aa%e3%83%aa%e3%83%86%e3%82%a3%e3%83%bc%e3%82%a2%e3%82%a4%e3%82%b3%e3%83%b3%e3%82%92%e6%a4%9c%e7%b4%a2%e3%81%a7%e3%81%8d%e3%82%8b%e3%82%b5/ http://1x1px.net/%e7%94%bb%e5%83%8f%e3%83%bb%e3%82%a4%e3%83%a9%e3%82%b9%e3%83%88/2010-10-31/%e7%84%a1%e6%96%99%e3%81%ae%e3%83%8f%e3%82%a4%e3%82%af%e3%82%aa%e3%83%aa%e3%83%86%e3%82%a3%e3%83%bc%e3%82%a2%e3%82%a4%e3%82%b3%e3%83%b3%e3%82%92%e6%a4%9c%e7%b4%a2%e3%81%a7%e3%81%8d%e3%82%8b%e3%82%b5/#comments Sun, 31 Oct 2010 06:59:44 +0000 admin http://1x1px.net/?p=57 フリーで利用出来るハイクオリティーアイコンを検索出来るサイトを集めてみました。

FindIcons

多国語での検索が可能。海外のサイトなのに日本語で検索できるのがかなり助かります。

色やサイズ・背景が透過しているしていない等で検索することができます。

icon　finder

海外のアイコン検索サイト。英語でないと検索できません。

色やサイズ・背景が透過しているしていない等で検索することができます。

IconsPedia

ロゴの下から検索が可能。英語での検索です。

こんな記事も読まれています

]]> http://1x1px.net/%e7%94%bb%e5%83%8f%e3%83%bb%e3%82%a4%e3%83%a9%e3%82%b9%e3%83%88/2010-10-31/%e7%84%a1%e6%96%99%e3%81%ae%e3%83%8f%e3%82%a4%e3%82%af%e3%82%aa%e3%83%aa%e3%83%86%e3%82%a3%e3%83%bc%e3%82%a2%e3%82%a4%e3%82%b3%e3%83%b3%e3%82%92%e6%a4%9c%e7%b4%a2%e3%81%a7%e3%81%8d%e3%82%8b%e3%82%b5/feed/ 0 背景と透過して見えるflickrのおもしろ画像 http://1x1px.net/%e7%94%bb%e5%83%8f%e3%83%bb%e3%82%a4%e3%83%a9%e3%82%b9%e3%83%88/2010-10-17/%e8%83%8c%e6%99%af%e3%81%a8%e9%80%8f%e9%81%8e%e3%81%97%e3%81%a6%e8%a6%8b%e3%81%88%e3%82%8bflickr%e3%81%ae%e3%81%8a%e3%82%82%e3%81%97%e3%82%8d%e7%94%bb%e5%83%8f/ http://1x1px.net/%e7%94%bb%e5%83%8f%e3%83%bb%e3%82%a4%e3%83%a9%e3%82%b9%e3%83%88/2010-10-17/%e8%83%8c%e6%99%af%e3%81%a8%e9%80%8f%e9%81%8e%e3%81%97%e3%81%a6%e8%a6%8b%e3%81%88%e3%82%8bflickr%e3%81%ae%e3%81%8a%e3%82%82%e3%81%97%e3%82%8d%e7%94%bb%e5%83%8f/#comments Sat, 16 Oct 2010 21:52:08 +0000 admin http://1x1px.net/?p=24 パソコンの壁紙をパソコン裏の背景と一体化させるという面白い発想。
一番下のリンク先には他にもいっぱいの透過背景の写真が載っています！

自分で撮影して家や仕事場に設定しておくと周りの人を驚かせるかもしれませんね！

＞画像をもっと観たい方はこちら

こんな記事も読まれています

]]> http://1x1px.net/%e7%94%bb%e5%83%8f%e3%83%bb%e3%82%a4%e3%83%a9%e3%82%b9%e3%83%88/2010-10-17/%e8%83%8c%e6%99%af%e3%81%a8%e9%80%8f%e9%81%8e%e3%81%97%e3%81%a6%e8%a6%8b%e3%81%88%e3%82%8bflickr%e3%81%ae%e3%81%8a%e3%82%82%e3%81%97%e3%82%8d%e7%94%bb%e5%83%8f/feed/ 0 950px幅のグリッドシステムデザイン http://1x1px.net/%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3/web%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3/2010-10-17/950px%e5%b9%85%e3%81%ae%e3%82%b0%e3%83%aa%e3%83%83%e3%83%89%e3%82%b7%e3%82%b9%e3%83%86%e3%83%a0%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3/ http://1x1px.net/%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3/web%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3/2010-10-17/950px%e5%b9%85%e3%81%ae%e3%82%b0%e3%83%aa%e3%83%83%e3%83%89%e3%82%b7%e3%82%b9%e3%83%86%e3%83%a0%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3/#comments Sat, 16 Oct 2010 21:29:49 +0000 admin http://1x1px.net/?p=20 最近ではyahooが950pxのデザインにリニューアルしてから950px幅でのサイトデザインが注目され始めました。

950pxでのグリッドデザインシステムがあればと検索したところいいサイトを発見しました。

950pxのGrid System Design

ここで紹介されているグリッドシステムのテンプレートがなによりありがたいですね。

そうそうちょうど探していたんです！

グリッドシステムデザインとは？

レイアウトを行う際、画面上に架空の縦横線をガイドラインとして引き、そのブロックごとに文字や図版を配置し、無駄なくスッキリした画面を作る手法のこと。

黄金比を用いたデザインにするとなお良いのです。

こんな記事も読まれています

]]> http://1x1px.net/%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3/web%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3/2010-10-17/950px%e5%b9%85%e3%81%ae%e3%82%b0%e3%83%aa%e3%83%83%e3%83%89%e3%82%b7%e3%82%b9%e3%83%86%e3%83%a0%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3/feed/ 0 はじめまして。 http://1x1px.net/%e6%97%a5%e8%a8%98/2010-10-16/%e3%81%af%e3%81%98%e3%82%81%e3%81%be%e3%81%97%e3%81%a6%e3%80%82/ http://1x1px.net/%e6%97%a5%e8%a8%98/2010-10-16/%e3%81%af%e3%81%98%e3%82%81%e3%81%be%e3%81%97%e3%81%a6%e3%80%82/#comments Sat, 16 Oct 2010 18:18:38 +0000 admin http://1x1px.net/?p=1 皆様に有益な情報と自分を出せていけたらいいなと思います。

よろしくお願いします！

こんな記事も読まれています

  • おすすめの記事がありません
]]> http://1x1px.net/%e6%97%a5%e8%a8%98/2010-10-16/%e3%81%af%e3%81%98%e3%82%81%e3%81%be%e3%81%97%e3%81%a6%e3%80%82/feed/ 0