You have {{ state.accountBalanceInEther }} ETH in the CryptoPunks contract — click here to withdraw to your wallet. 10,000 unique collectible characters with proof of ownership stored on the Ethereum blockchain. The project that inspired the modern CryptoArt movement. CryptoPunks are one of the earliest and most iconic examples of "Non-Fungible Tokens” minted on Ethereum, and were the inspiration
先日、同じ形のアイコンを色違いで複数のページに挿入するというタスクがあり、 ①色が違うだけのアイコンをpngなどで1つ1つ画像を書き出す ②しかも、それぞれスマートフォンサイト用に@2xサイズまで作成する ということが非常に不毛に思えたので、 何とか使いまわし出来ないかと考え、この方法にたどり着きました。 ゴール 同じ形のアイコンを色違いで表示させる ゴールイメージ(デモ画面) See the Pen BMmXOO by yamaki (@yamaki0405) on CodePen. 手順 1.SVGを作成する 2.作成したSVGをHTML内にインラインで指定する 3.CSSで色を指定する 1.SVGを作成する 作成したアイコンをIllustlatorやPhotoshop(CC以降)で書き出します。 作成するのが手間という方は、フリーで配布されているSVGもたくさんあるので、そちらを使っ
必要なもの SVG形式の画像データ 手順 SVG画像をエディターで開き、コードを全てコピー パーセントエンコーディング(変換ツール)してurlに指定 必要に応じて色や表示方法を調整 //fill='%23<カラーコード>'を追記して色を調整。 //%23 = # background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg class='drawer__icon' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 30'%3E%3Ctitle%3Eframe%3C/title%3E%3Cg%3E%3Cpath fill='%23008ed6' d='M22.31,14.15c-2.13-3.86-6.93-8.07-8-11.43S12.73-1.16,9,2.7A34.71
大石制作ブログblog.s004.com デザイナー大石真也が 知りたかったこと、見たかったことのメモと、仕事紹介。 自己紹介・サイト説明依頼・価格・お問合せタスク管理パートナーtwitterfacebookatom feed SVG、すっかりどこでも見かけるようになりましたね。近年、僕が仕事で作るサイトでもロゴや主要なアイコン画像を中心に、積極的に使うようになりました。 ファイルサイズ、解像度、動的な扱いやすさ等で、これまでのJPEG、PNG、GIFに比べたメリットの多いSVGだけど、とにかく取扱がめんどうに感じるのが正直なところです。 Bootstrap3→4への変化でCSSへのインラインSVG埋め込みに変わった箇所をみつけた HTML/CSS/JSフレームワークのBootstrapのバージョン3と4のコードを見比べてたとき、メニューボタンのアイコン( こんなの→ )がバージョン3まで
英国Raspberry Pi財団は、「Raspberry Pi 4 Model B(以下、ラズパイ4)」の組み込みモジュール版となる「Raspberry Pi Compute Module 4」を発表。Armの「Cortex-A72」を4コア搭載する「BCM2711」はそのままに、RAMやフラッシュストレージの容量、無線通信機能の有無などによって変わる32品種を用意した。価格は25~90米ドル。 英国Raspberry Pi財団は2020年10月19日(現地時間)、「Raspberry Pi 4 Model B(以下、ラズパイ4)」の組み込みモジュール版となる「Raspberry Pi Compute Module 4」を開発したと発表した。Armの「Cortex-A72」を4コア搭載する「BCM2711」はそのままに、RAMやフラッシュストレージの容量、無線通信機能の有無などによって変わ
こんな感じで、好きな画像を指定することができます。オールドブラウザでも問題なく動作するので、ブラウザのバージョンなどを気にせず使うことができます。 background-imageの使い方 では早速background-imageの使い方を見ていきましょう。以降の説明では、下記のHTMLとCSSを基本に進めていきます。 HTML <div class="bg_test"> <div class="bg_test-text"> 背景画像を設定します </div> </div> CSS .bg_test-text { border: solid 1px; /* 枠線指定 */ display: inline-block; /* インラインブロックにする */ padding: 10px 20px; /* 余白指定 */ background-color: rgba(255, 255, 255,
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く