程序设计——期末考试（大题详解）

最新推荐文章于 2023-09-20 18:22:48 发布

Anita-Sun

最新推荐文章于 2023-09-20 18:22:48 发布

阅读量664

点赞数 2

分类专栏：期末总结文章标签：列表 css html

本文链接：https://blog.csdn.net/AnitaSun/article/details/112253235

版权

期末总结专栏收录该内容

31 篇文章 13 订阅

订阅专栏

阅读题：

表格标签

表格基本的三个要素：表格标题、项目表头、数据资料
table 定义一个表格
caption 定义表格标题
tr 定义表格中的一行
th 定义表格中的表头单元格，嵌套在tr中
td 定义表格中的数据单元格，嵌套在tr中
表格边框的属性：
frame：设置表格边框样式
rules：设置表格内部边框样式
单元格的合并
colspan：水平单元格合并
rowspan：垂直单元格合并

分组元素

<ul> 元素
ul 元素表示不排序的项目列表 <ul> <li></li> </ul>
属性 type设置列表符号样式，可以取disk、circle、square
<ol>元素
有序的列表项目

css样式

背景样式
background-attachment：设置背景图像是否随页面一起滚动，取值scroll（滚动）、fixed（固定）
background-origin：规定background-position属性相对于什么位置来定位
background-clip：background-clip
网页中字体样式属性
font-variant：设定小型大写字母（normal：正常；small-caps：小型大写字母）
网页中文本样式属性

css导入

导入css的四种方法

大题：

<html>

<head>
    <title>日期对象</title>
</head>

<!-- 
    常用日期及时间的获取：
    getDate()[一个月中的某一天] getDay()[一周中的某一天]
    getMonth() getFullYear() getYear()
    getHours() getMinutes() getSeconds() getMillseconds() 
    getTime()[返回1970年1月1日至今的毫秒数]
 -->
<!-- 
    常用日期及时间的设置
    setDate()[设置Date对象中的某一天（1~31）
    setMonth() setFullYear() setHours()[0-23] setMinutes() 
    setSeconds()[设置秒数] setMillseconds() 
 -->

<!-- 
     日期对象的方法：
     1. setTimeout(函数名, 间隔时间);
        a = setTimeout(funciton(){alert("Hello");}, 3000);
     2. clearTimeout
        clearTimeout(a);
  -->
<script>
    //常用日期及时间的获取
    var date1 = new Date(); //Tue Jan 05 2021 19:43:17 GMT+0800 (中国标准时间)
    var year = date1.getFullYear(); //2021

    //常用日期及时间的设置
    var date2 = new Date();
    date2.setFullYear(2020, 10, 25); //设置年月日
    date2.setDate(date2.getDate() + 2);

    //例题：计算当前距离元旦还有多久
    var now = new Date();
    var nationalDay = new Date(2019, 0, 1, 0, 0, 0);
    var msel = nationalDay - now;
    document.write("距离2019年元旦还有：", + msel + "毫秒<br>");
    document.write("距离2019年元旦还有：", + parseInt(msel / 1000) + "秒<br>");
    document.write("距离2019年元旦还有：", + parseInt(msel / (60 * 1000)) + "分钟<br>");
    document.write("距离2019年元旦还有：", + parseInt(msel / (60 * 60 * 1000)) + "小时<br>");
    document.write("距离2019年元旦还有：", + parseInt(msel / (60 * 60 * 24 * 1000)) + "天<br>");

    //计时器设计案例
    var timeResult = 0;
    var timer;
    function timedCount() {
        document.txtForm.txt.value = timeResult;
        timeResult = timeResult + 1;
        timer = setTimeout("timedCount()", 1000);
    }

    function stopCount() {
        clearTimeout(timer);
    }

</script>

<body>
    <form id="txtForm" name="txtForm" method="get">
        <input type="button" value="开始！" onclick="timedCount()">
        <input type="text" name="txt" id="txt">
        <input type="button" value="停止！" onclick="stopCount()">
    </form>
</body>

</html>

<html>

<head>
    <title>XX表</title>
</head>
<!-- 
    input表单常用的属性：
    type、name、value、size、
    readonly：属性规定输入字段为只读（不能修改）
    disabled：属性规定输入字段是禁用的，被禁用的元素是不可用和不可点击的，被禁用的元素不会被提交。
    checked、maxlength
    Paceholder：用户输入提示
    required：设置元素必填
    autofocus：自动获得焦点
    pattern：验证输入字段
             适用于text search url telephone email password
 -->
<!-- 
    HTML5中新增type属性值：下面这些属性本身就带有对表单类型进行验证的功能
    color	        定义拾色器。
    date	        定义日期字段（带有 calendar 控件）
    datetime	    定义日期字段（带有 calendar 和 time 控件）
    datetime-local	定义日期字段（带有 calendar 和 time 控件）
    month	        定义日期字段的月（带有 calendar 控件）
    week	        定义日期字段的周（带有 calendar 控件）
    
    email	        定义用于 e-mail 地址的文本字段
    number	        定义带有 spinner 控件的数字字段
    range	        滑动条
    search      	定义用于搜索的文本字段
    tel	            定义用于电话号码的文本字段
    url         	定义用于 URL 的文本字段
 -->
<!-- 
    正则表达式
    表单验证常用的正则表达式：
    1.邮政编码   ^([0-9][6])$
    2.手机号码   ^(13[0-9]|15[0-9]|18[0-9])([0-9]{8}$
    3.用户名     ^[a-zA-Z0-9_\-]{4,16}$
      
 -->

<body>
    <form action="url" method="get/post" name="表单名称">
        <fieldset>
            <legend>信息表</legend>
            姓名:<input type="text"><br />
            密码:<input type="password"><br />
            学历:
            <!-- size是可见选项的数目 multiple是设定为多选-->
            <select name="XXX" size="1" multiple>
                <option value="本科">本科</option>
                <option value="大专">大专</option>
                <option value="研究生" selected>研究生</option>
                <option value="博士">博士</option>
            </select><br />
            性别:
            <input type="radio" value="男">男
            <input type="radio" value="女" checked>女<br />
            爱好:
            <input type="checkbox" value="吃饭"> 吃饭
            <input type="checkbox" value="睡觉" checked> 睡觉
            <input type="checkbox" value="打豆豆"> 打豆豆<br />
            按钮:
            <input type="button" value="⭐"><br />
            隐藏:
            <input type="hidden"><br />
            滑动条：
            <input type="range"><br />
            搜索框：
            <input type="search"><br />
            url地址输入框：
            <input type="url"><br />
            邮箱：
            <input type="text" pattern="^([0-9][6])$">
            <span style="color: red">请输入格式为XXX的邮箱</span>
            <!--- 提示信息 -->
        </fieldset>

        <input type="submit">
        <input type="reset">
    </form>
</body>

</html>

Anita-Sun

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
程序设计——期末考试（大题详解）

阅读题：表格标签表格基本的三个要素：表格标题、项目表头、数据资料table 定义一个表格caption 定义表格标题tr 定义表格中的一行th 定义表格中的表头单元格，嵌套在tr中td 定义表格中的数据单元格，嵌套在tr中表格边框的属性：frame：设置表格边框样式rules：设置表格内部边框样式单元格的合并colspan：水平单元格合并rowspan：垂直单元格合并分组元素<ul> 元素ul 元素表示不排序的项目列表 <ul> <
复制链接

扫一扫

专栏目录