Q&A
回答ありがとうございます。
記載してあるリンクに飛ぶと
step1）add html
Step 2) Add CSS:
Style the header and the list:
以下コードが書かれてありました。
良ければリンクからそのサイトを閲覧してもらえば幸いです。
前提・実現したいこと
To DO リストのようなものを作りたいんですが
あまり慣れてなくなぜこうなるのかが分かりません
コピペしてきたんですが同じようにならず困っています。
発生している問題・エラーメッセージ
ブラウザでの表示が異なる
画像中央が実際に実行したブラウザ
画像左が希望の画面
該当のソースコード
html
1<!DOCTYPE html> 2<html lang="en" dir="ltr"> 3 <head> 4 <meta charset="utf-8"> 5 <title>To Do list</title> 6 </head> 7 <body> 8 9 <div id="myDIV" class="header"> 10 <h2>My To Do List</h2> 11 <input type="text" id="myInput" placeholder="Title..."> 12 <span onclick="newElement()" class="addBtn">Add</span> 13 </div> 14 15 <ul id="myUL"> 16 <li>Hit the gym</li> 17 <li class="checked">Pay bills</li> 18 <li>Meet George</li> 19 <li>Buy eggs</li> 20 <li>Read a book</li> 21 <li>Organize office</li> 22 </ul> 23 </body> 24</html> 25
補足情報（FW/ツールのバージョンなど）
リンク内容
このサイトの結果の様にしたいんです。
回答3件
0
cssを書きましたか？
投稿2023/02/15 10:45
総合スコア13
0
CSS(スタイルシート)が読み込まれていないのだと思います。
見本のソースに下記のような記述がありませんか。
または
<style> ... ... </style>投稿2021/07/31 14:34
総合スコア1293
こちらが完成形のソースのようなのでこちらを丸々コピペすれば理想の表示になると思います。
https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_todo
このTODOリストはHTMLに加え
見た目の装飾をする「CSS」と
HTML・CSSをプログラムで書き換える「JavaScript」
を使って実現されています。
この項目について検索等して勉強されると良いと思います。
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。