• 【練習問題】HTMLトレーニングドリル7

    難易度: ★★ 目標タイム:10分 問題 背景画像の上にボタンを表示して、完成図のように表示されるようにしましょう。 【背景画像横幅】100% 【ボタン位置】中央 【ボタン背景色】#ff8056 【オンマウス時ボタン背景 […]

    続きを読む >>
  • 【HTML】トレーニングドリル6 リストのアイコン画像をCSSで設定しよう

    難易度: ★★ 目標タイム:10分 問題 以下のリストを作成し、先頭にアイコンを表示させましょう。 【リンク文字色】#3999AD 【オンマウス時リンク文字色】#7DC6D5 【リストアイコン画像】以下の使用画像を右クリ […]

    続きを読む >>
  • HTML トレーニングドリル5 テーブルの背景色を設定しよう

    【HTML】トレーニングドリル5 テーブルの背景色を設定しよう

    難易度: ★★ 目標タイム:10分 問題 以下のテーブルを作成し、偶数行のセルの背景色を設定しましょう。 【テーブル横幅】600px 【Noの幅】60px 【ヘッダ背景色】#56b3c7 【ヘッダ文字色】白 【奇数行背景 […]

    続きを読む >>
  • 【HTML】トレーニングドリル4 ボタンの位置を固定しよう

    難易度: ★★ 目標タイム:8分 問題 お問い合わせボタンを右上の位置に固定表示して、画面をスクロールしてもずっと表示されるようにしてみましょう。 (1)右上にお問い合わせボタンを表示する 【背景色】 #E34D77 【 […]

    続きを読む >>
  • HTML トレーニングドリル3 ボタン風リンクを作成しよう

    【HTML】トレーニングドリル3 ボタン風リンクを作成しよう

    難易度: ★ 目標タイム:5分 問題 以下のボタン風リンクを作成してみましょう。 【横幅】240px 【背景色】 #E34D77 【文字色】白 【角丸】6px 【オンマウス時】透過する 【リンク先】https://gee […]

    続きを読む >>
  • 【HTML】トレーニングドリル2 枠線を使ってデザインしてみよう

    【HTML】トレーニングドリル2 枠線を使ってデザインしてみよう

    難易度: ★ 目標タイム:5分 問題 以下のdivを作成して、枠線を引いてみましょう。 【横幅】600px 【高さ】600px 【背景色】 #FEEEF2 【枠線の色】#F7D2DB 【枠線の太さ】2px 【位置】上から […]

    続きを読む >>
  • 【HTML】トレーニングドリル1 中央配置をマスターしよう

    【HTML】トレーニングドリル1 中央配置をマスターしよう

    難易度: ★ 目標タイム:3分 問題 以下のdivを作成してください。 【横幅】600px 【背景色】 #ccc 【高さ】画面高さ 【位置】左右中央寄せ 完成イメージ よく、ブラウザの中央にコンテンツが配置されてるサイト […]

    続きを読む >>