实验一 HTML编程基础和Javascript编程基础

一、实验目的
1、体会HTML编程;
  2、掌握HTML基本元素
3、掌握Javascript函数的定义和使用方法
二、实验内容
1) 做一个表格,3行,4列,内容不限,表格格式要求
•网页标题栏有显示
•网页内容有标题
•表格居中
•表格有表头
•表格显示内容有属性差异:
•表格间距
•表格背景色
•文字的位置、大小


<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>copytitle>
head>
<body>
    <h1 align="center">学生信息表h1>
    <tr><th>姓名th>
            <th>性别th>
            <th>年龄th>
            <th>作业th>
        tr>
        <tr bgcolor="aqua" align="center">
            <td>小旋风td>
            <td>td>
            <td>19td>
            <td>计算机td>
        tr>
        <tr align="center">
            <td>张继科td>
            <td>td>
            <td>21td>
            <td>计算机td>
        tr>
    table>
body>
html>
 
  

实验一 HTML编程基础和Javascript编程基础_第1张图片

  1. 创建一个表单,行按照20%和80%划分frameset
    (a)20%frame部分显示多个链接
    (b)点击任一个超链接,在80%frame部分显示对应的页面
    ©登录页面login.html
    (d)注册页面register.html,表单实现注册用户相关信息录入,包含提交和重置按钮。
    (e)基本信息包括:姓名,年龄,生日,所在城市,爱好,联系电话等

`HTML:

copy copy


登陆 注册
友情链接: 张继科吧

张继科百度百科
copy

欢迎登录

用户名:
密码:
copy

欢迎成为张继科的粉丝

姓名: 年龄:
生日:
爱好: 旅游 看书
联系电话:
所在城市:
`![在这里插入图片描述](https://img-blog.csdnimg.cn/20201013174653254.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0Rlc3RpbnlfMTU5,size_16,color_FFFFFF,t_70#pic_center)

3)制作电子时钟,可用数字或图片表示,时钟的启动和停止


<html>
<head>
    <meta charset="UTF-8">
    <title>copytitle>
head>
<body style="background-repeat: no-repeat;margin-left: 180px;">

<h1>动态时钟h1>
<p>
    当前时间:<span id="clock" style="color: #FF0000;"/> span>
p>
<p>
    <input type="button" value="start" onclick="start()" style="color: #FF0000;"/>
    <input type="button" value="stop" onclick="stop()" style="color: #FF0000;"/>
p>
body>
<script type="text/javascript">
    var timer;
    function start(){
      
        //设置定时器(方法的实现,毫秒数)
        timer=setInterval(function(){
      
            var now=new Date();
            var time=now.toLocaleTimeString();
            var c=document.getElementById("clock");
            c.innerHTML=time;
        },1000);
    }
    function stop(){
      
        //暂停  清楚定时器
        clearInterval(timer);
    }
script>
html>

实验一 HTML编程基础和Javascript编程基础_第2张图片

你可能感兴趣的:(Web前端作业,html,css,javascript,js)