This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.text { | |
--minSize: 16; | |
--maxSize: 32; | |
--minViewportWidth: 768; | |
--maxViewportWidth: 1440; | |
font-size: clamp(calc(var(--minSize) * 1px), calc((var(--minSize) * 1px) + (var(--maxSize) - var(--minSize)) * ((100vw - (var(--minViewportWidth) * 1px)) / (var(--maxViewportWidth) - var(--minViewportWidth)))), calc(var(--maxSize) * 1px)); | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* 省略記号(…)だけに特定のフォント(Arial)を適用するためのフォント定義 */ | |
@font-face { | |
font-family: 'ellipsis'; /* フォントファミリー名を "ellipsis" とする */ | |
src: local("Arial"); /* ローカルの Arial フォントを使用 */ | |
unicode-range: U+2026; /* Unicode 2026(…)だけをこのフォントで描画 */ | |
} | |
div { | |
width: 200px; | |
text-overflow: ellipsis; /* コンテンツがオーバーしたら "…" を表示 */ |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.wrapper{ | |
display:grid; | |
} | |
.container{ | |
max-width:1200px; /* これを消すとはみださなくなる*/ | |
display: grid; | |
grid-template-columns: repeat(auto-fit,minmax(300px, 1fr)); | |
} | |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.container { | |
position: relative; | |
display: grid; | |
grid-template-columns: 1fr; | |
grid-template-rows: 1fr; | |
margin-top: 100vh; | |
& > .background { | |
position: sticky; | |
top: 0; | |
left: 0; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
define('DB_HOST', 'データベースのホスト名'); // データベースのホスト名 | |
define('DB_USER', 'データベースのユーザー名'); // データベースのユーザー名 | |
define('DB_PASS', 'データベースのパスワード'); // データベースのパスワード | |
define('DB_NAME', '使用するデータベース名'); // 使用するデータベース名 | |
define('DB_CHARSET', 'データベースの文字コード'); // データベースの文字コード | |
?> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<label for="file-input"> | |
<span>ファイルを選択</span> | |
<input type="file" id="file-input" multiple /> | |
</label> | |
<ul id="file-list"></ul> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
body { | |
padding-top: 100vh; | |
padding-bottom: 100vh; | |
} | |
.container { | |
position: relative; | |
width: 100%; | |
height: 50vh; | |
background-color: orange; | |
view-timeline-name: --container; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.slider { | |
position: relative; | |
width: 80%; /* スライダーの横幅を設定 */ | |
max-width: 1200px; | |
margin-inline: auto; | |
& .slider-container { | |
container-type: inline-size; | |
position: relative; | |
display: flex; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const sample = [ | |
{ | |
id: 1, | |
name: "name1", | |
}, | |
{ | |
id: 2, | |
name: "name2", | |
}, | |
]; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const desiredFPS = 30; // 上限フレームレートを設定 | |
const frameInterval = 1000 / desiredFPS; // 1フレームの間隔(ミリ秒) | |
let lastTime = 0; | |
const update = function (time) { | |
if (time - lastTime >= frameInterval) { | |
lastTime = time; | |
console.log("実行"); | |
} | |
requestAnimationFrame(update); |
NewerOlder