タグ

角丸に関するkikimimi_missyのブックマーク (2)

  • [CSS]ページが長くても、ページ全体を角丸のボーダーで囲むスタイルシートのテクニック | コリス

    ページ全体を角丸のボーダーで囲み、そのページがスクロールするくらい長くても全体を囲むスタイルシートのテクニックを紹介します。 Body Border, Rounded Inside Step 1: ページ全体を角丸で囲む(スクロール非対応) Step 2: ページ全体を角丸で囲む(スクロール対応) Step 3: ページ全体を角丸で囲む(スクロールバーを変更) Step 1: ページ全体を角丸で囲む(スクロール非対応) まずはシンプルなスタイルシートで、ページ全体を角丸のボーダーで囲んでみましょう。 基的な考え方は、body要素にborder-imageを使い、4つの角を角丸にします。使用するのは下記の画像です。 角丸用の画像 コードを見てみましょう。 HTML HTMLは、bodyだけで構いません。 <body> <h1>Rounded inside body border</h1>

  • 角丸の作成・修正の強力な武器になる機能拡張 -Corner Editor | コリス

    Corner Editor Corner Editorの主な特徴 Corner Editorのインストール Corner Editorの使い方 Corner Editorの主な特徴 旧版の全ての機能が使え、更に多くの機能を備えています。 直線で作成された角に角丸作成・修正ができます。 角を一つだけでも、複数同時でも、複数別でも簡単に角丸を適用できます。 角の種類は角丸だけでなく、計4種類のスタイルに増えました。 多角形にも対応しました。 一度設定した内容をセーブできるようになりました。 パスがスムースになりました。 各コーナーにラベルを付与できるようになりました。 Corner Editorのインストール インストールは簡単です。 ※Win/Mac共通です。 ダウンロードして解凍した「Corner Editor.jsx」を、Photoshopフォルダ内の「/Presets/Scripts/

  • 1