「border-radius」のブログ記事一覧

2013/04/12

CSS3のborder-radiusで画像を円形に切り抜いてボーダーを付ける時のハック

最近はCSS3が普及してきたことで、サークルデザイン（円形）のデザインが増えてきていますね、2013年のトレンドデザインとしてもサークルデザインがよく取り上げられます。 今回は、CSS3のborder-radiusを使って画像を円形に切り抜き、更に円形のborderでかこむデザインをコーディングしていたのですが、iPhoneのSafariやモバイルGoogle Chromeで不具合が起こった...続きを見る

2011/11/29

#CSS3 を使って実現する、画像を使わない角丸タブメニューの作り方 #html5

お客様からのご依頼で、お問い合わせページに「ご意見箱」と「予約フォーム」を設置することになりました。 それぞれ別のCGIでフォームを作るのですが、その表示の切り替えナビゲーションとして、CSS3を利用した画像を使わない角丸タブメニューを作って見ました。 tabメニュー全体をdivで囲んで、border-bottom で5px のボーダーを引きます。 角丸部分はborder-radiusを...続きを見る