web前端开发技术储久良第三版第12章练习与实验答案_诗和远方

web前端开发技术储久良第三版答案整理（10-17章）

1.选择题

(1)D (2)C (3)B (4)C (5)A

2.填空题

(1)post、get

(2)浏览器、服务器

(3)<option>、name、size、multiple

(4)textarea、rows、cols

(5)reset、submit、button

(6)不相同、不相同；相同、不相同

(7)checked、selected

(8)fieldset、legend

实验12

1、源代码 exp_12_1演示

<!DOCTYPE html>
<html>

<head>
  <title>登录页面</title>
  <style>
    .box {
      max-width: 20rem;
      text-align: center;
      line-height: 1.5rem;
    }

    .align-left {
      text-align: left;
    }

    button {
      margin: .5rem;
    }
  </style>
</head>

<body>
  <form>
    <fieldset class="box">
      <legend class="align-left">登录页面</legend>
      用户名: <input type="text"><br>
      密 码: <input type="password"><br>
      类 型:
      <input type="radio" name="usertype" value="admin" checked="true">管理员
      <input type="radio" name="usertype" value="user">普通用户
      <br />
      <input type="checkbox" name="remember" value="true">记住密码
      <input type="checkbox" name="auto" value="false">自动登录
      <br />
      <button>提交</button> <button>重置</button>
    </fieldset>
  </form>
</body>

</html>

2、源代码 exp_12_2演示

<!DOCTYPE html>
<html>

<head>
  <title>应聘页面</title>
  <style>
    body {
      font-family: serif, Arial, Helvetica, sans-serif;
    }

    .box {
      max-width: 20rem;
      text-align: center;
      line-height: 1.5rem;
      display: inline-block;
      border: 2px solid gray;
      padding: 3px;
    }

    .li-item {
      text-align: left;
    }

    .adivgn-left {
      text-align: left;
    }

    button {
      margin: .5rem;
    }
  </style>
</head>

<body>
  <form>
    <strong>希望工作地点：</strong><input type="text">
    <strong>月薪要求：</strong><input type="text">
    <input type="checkbox" name="auto" value="false">要求提供过渡住房<br />
    <strong>请选择应聘行业：</strong><br />
    <div class="box">
      <div class="li-item" id="0">计算机软件</div>
      <div class="li-item" id="1">计算机硬件</div>
      <div class="li-item" id="2">计算机服务</div>
      <div class="li-item" id="3">通信/电信/网络设备</div>
      <div class="li-item" id="4">互联网/电子商务</div>
      <div class="li-item" id="5">网络游戏</div>
      <div class="li-item" id="6">电子技术/半导体/集成电路</div>
      <div class="li-item" id="7">仪器仪表/工业自动化</div>
    </div>
    <button>提交</button><button>重置</button>
  </form>

  <script>
    let items = document.getElementsByClassName('li-item')
    items[0].style.backgroundColor = '#1E9FFF'
    for (let i = 0; i < items.length; i++) {
      items[i].onclick = function () {
        for (let i = 0; i < items.length; i++) {
          items[i].style.backgroundColor = '#FFFFFF'
        }
        items[i].style.backgroundColor = '#1E9FFF'
      }
    }
  </script>
</body>

</html>

web前端开发技术储久良第三版第12章练习与实验答案

web前端开发技术储久良第三版答案整理（10-17章）

首发弈心博客，转载请附链接！

建站不易，感谢支持！

web前端开发技术储久良第三版第12章练习与实验答案

web前端开发技术储久良第三版答案整理（10-17章）

首发 弈心博客，转载请附链接！

建站不易，感谢支持！

首发弈心博客，转载请附链接！