/* 時間 */
mydate=new Date();
Ye=mydate.getFullYear()+".";
Mo=mydate.getMonth()+1+".";
Da=mydate.getDate()+".";
Day=mydate.getDay();
Day2=new Array(7);
Day2[0]="日";Day2[1]="月";Day2[2]="火";
Day2[3]="水";Day2[4]="木";Day2[5]="金";
Day2[6]="土";
document.write(Ye+Mo+Da+"("+Day2[Day]+")");
こちらのJSなのですが
Day2(曜日)の部分の文字色と背景を設定し、四方に丸みをつけたいのですが
どうすればよろしいですか?ご存じの方お願いいたします。
A 回答 (3件)
- 最新から表示
- 回答順に表示
No.3
- 回答日時:
<div id="hoge"></div>
<script>
const mydate=new Date();
let Y,M,D;
[Y,M,D]=mydate.toLocaleDateString().split("/");
const Day=["日","月","火","水","木","金","土"][mydate.getDay()];
hoge.innerHTML=`${Y}.${M}.${D} <span style="display:inline-block;background-Color:blue;color:yellow;border-radius:5px;">(${Day})</span>`;
</script>
No.2
- 回答日時:
Day2 を <span> で囲む
span に style 属性を付ける
参考)
https://developer.mozilla.org/ja/docs/Web/CSS/co …
https://developer.mozilla.org/ja/docs/Web/CSS/ba …
https://developer.mozilla.org/ja/docs/Web/CSS/bo …
できれば
document.write(値) をやめて、
document.getElementById("親要素名").innerHTML = 値 にする
No.1
- 回答日時:
こんばんは
スクリプトというよりもCSSの質問ですね。
修飾したい部分だけテキストを分けて、例えば
2021.9.22.<span class="weekday">水</span>
などのようにしておいて、CSSあるいはスクリプトからスタイルを設定すれば宜しいかと。
例えば、
.weekday{
display: inline-block;
width: 1.4em; height: 1.4em;
text-align: center;
background-color: cyan;
border-radius: 50%;
}
とか。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 1日1回引けるJavaScriptおみくじについて 1 2022/12/12 22:28
- 英語 同じ意味ですか? Today is my first day at work. Today is m 3 2022/04/10 23:13
- Visual Basic(VBA) ①ExcelVBAでカレンダーを作り、別のユザーフォームで日付を入力したいのですがエラーになります。 1 2023/02/17 18:39
- 英語 訳し方を教えてください! 2 2022/12/26 19:45
- 先物取引 日本国債先物のCFD取引について 1 2023/08/04 18:09
- Visual Basic(VBA) 今日の日付が過ぎたらその行を削除したい 1 2023/04/01 20:06
- Visual Basic(VBA) 【再投稿】VBAのシフト表でバグが出て困っています 3 2022/09/24 08:29
- 英語 【 論・表 for the day の意味 】 She often took both of us 2 2022/08/14 17:36
- 英語 【英語】 ①I had a long day ②It’s been a long day ③It w 4 2022/07/28 01:47
- 英語 "this day"が当日か今日を表すのかの使い分け方等について 5 2023/08/08 14:29
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
javascriptテキストBOX色を元に...
-
MAX関数を使ってからLEFT JOIN...
-
自働生成される<div>タグに連番...
-
指定したパスが現URLに含まれて...
-
removeAttribute()メソッドで削...
-
クリックすると下に説明文が出...
-
リンク色を動的に変更したい。i...
-
ネストされたハッシュの値から...
-
iframe内からjQueryで指定したい
-
JavascriptでDIV~DIVをリロードで
-
プルダウンとチェックボックス...
-
checkboxにチェックを入れると...
-
テキストエリア内の一部の文字...
-
折りたたみ式JavaScriptをcheck...
-
背景色を一定時間ごとにランダ...
-
JSで動的にリンクを作成
-
javascriptでのアコーディオン...
-
複数のリンク画像を一定時間で...
-
ページ遷移後のcssプロパティ保持
-
IFRAMEの表示/非表示を切り替え...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
MAX関数を使ってからLEFT JOIN...
-
javascriptテキストBOX色を元に...
-
IFRAMEの表示/非表示を切り替え...
-
removeEventListenerについて
-
背景色を透明化
-
createElementで作成した要素を...
-
javascriptでpostした値が取得...
-
読み込んだQRコードをフォーム...
-
iframe内のリンクが飛ばないの...
-
jQueryでクリックされた要素のi...
-
ダブルクォーテーションが消え...
-
<div ~ </div> で囲まれたテキ...
-
【HP作成】クリックすると下...
-
<Div>の中の要素の数を調べる
-
jQueryで特定id以外の下にある...
-
VBScript+IEのチェックボック...
-
removeAttribute()メソッドで削...
-
折りたたみ部分にアンカーでリ...
-
onclickを利用した伸縮メニュー...
-
背景色を一定時間ごとにランダ...
おすすめ情報

