2024年10月クラス
index.html <button id="start" onclick="gacha();">ガチャを引く</button> <div id="img-box"></div> <script> function gacha(){ //配列を使ってランク別に画像を保存 let star3 = ['01.png','02.png']; let star2 = ['03.png','04.png','05.png','06.png']; let star1 = ['07.png','08.png','09.png','10.png','11.png','12.png']; //conso…
index.html <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Felica Bread&Salad</title> <link rel="preconnect" href="https://fonts.googleapis.com"> </link></meta></meta></head></html>
script部分 function gacha(){ //配列を使ってランク別に画像を保存 let star3 = ['01.png','02.png']; let star2 = ['03.png','04.png','05.png','06.png']; let star1 = ['07.png','08.png','09.png','10.png','11.png','12.png']; //console.log(star1); …
See the Pen 入力画面 by yachin29 (@yachin29) on CodePen. EFO（Entry Form Optimisation）は「入力フォーム最適化」の略で、入力フォームをユーザーにとって使いやすく入力しやすい形に最適化し、入力して内容を送信できるように改善を行う施策のことを指…
非常に便利なGoogle Formですが、デフォルトの状態だと「送信ボタン」をクリックした後の動きが若干解り難いです。 お問い合わせフォームでは「送信ボタン」をクリックした後、「完了画面」にページ遷移する形が一般的です。 Google FormもJavaScriptなどで…
index.html <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>スマホ特化型サイトの作成</title> <link rel="preconnect" href="https://fonts.googleapis.com"> </link></meta></meta></head></html>
index.html <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>スマホ特化型サイトの作成</title> <link rel="preconnect" href="https://fonts.googleapis.com"> </link></meta></meta></head></html>
index.html <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>割合を設定したランダム</title> <style> img{ vertical-align: bottom; max-width: 100%; } .box{ width: 240px; margin: 50px auto 0; } #btn{ padding: 10px; } </meta></meta></head></html>
background-attachmentをfixedにすると簡単にパララックス（視差効果）を使ったスクロールが実装出来ます。 ただ、iOSはどういった理由か、この「background-attachment:fixed;」を頑なに対応させない為（ベンダープレフィックスを付けてもダメ）、iOSでは別…
index.html <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Felica Bread&Salad</title> <link rel="preconnect" href="https://fonts.googleapis.com"> </link></meta></meta></head></html>
index.html <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Felica Bread&Salad</title> <link rel="preconnect" href="https://fonts.googleapis.com"> </link></meta></meta></head></html>
header画像の作成 使用するテキストCafé Italia Melbourne; Café Italia, Carlton; Get Menu, Reviews, Contact, Location, Phone Number, Maps and more for Café Italia Restaurant on Zomato. 使用素材 子牛のステーキ アスパラガス添え しっとりと柔らか…
使用テキスト ホテルフェリカ 池袋駅東口より徒歩3分と絶好のロケーション。世界のトップアーティストが数々の公演を繰り広げる「東京芸術劇場」など新しく生まれかわった文化の街池袋、東京の城北地区唯一のグランドホテルです。 シングル・スタンダードル…
CSS（Cascading Style Sheets） CSSとは、HTMLの要素をどのように修飾（表示）するかを指示する、W3Cによる仕様の一つ。HTMLによる文書構造と体裁を分離させるという理念を実現する為に提唱されたスタイルシートの具体的な仕様の一つ。 h1やpなどの意味付け…
マークアップ とは、機械が文書の構造を認識出来るように、文書の各要素に目印を与えて行く事です。 見出しや段落などと言った紙の文書では当り前にある要素だけでなく、ハイパーリンクのアンカーなどのようなハイパーテキスト独自の要素なども、マークアッ…
