简单考核题（前台）

最新推荐文章于 2022-04-21 09:32:57 发布
最新推荐文章于 2022-04-21 09:32:57 发布
阅读量362 收藏
点赞数
分类专栏： 前台 文章标签： 数据
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Chris_mu/article/details/77878068
版权

1) 在页面中心显示一个上下边缘颜色为#44667F,左右边缘颜色为#0F2376,且边缘宽度为5px的信息框,信息框内要有一个外边距均为10PX的一个信息框。在该信息框中显示“Hello World”.点击“Hello World”发送一个Post 请求（地址为：“localhost “,数据为“PostTest”，传输成功之后，会有一个提示框，提示“SENd DaTa Successfully“）.

页面截图：

源码：

<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>test1</title>
  <script src="jquery-1.3.1.js" type="text/javascript"></script>
  <style>
    .aa:before {
      content: "";
      display: inline-block;
      height: 100%;
      width: 0;
      vertical-align: middle;
      margin-left: -.25em; //这里是为了去除inline-block的空隙的影响
    }

    html,
    body {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }

    .aa {
      width: 100%;
      height: 100%;
      text-align: center;
    }

    .aaa {
      width: 300px;
      height: 110px;
      color: #fff;
      text-align: center;
      line-height: 220px;
      border-top: 5px solid #44667F;
      border-bottom: 5px solid #44667F;
      border-left: 5px solid #0F2376;
      border-right: 5px solid #0F2376;
    }

    .aaaa {
      width: 280px;
      height: 90px;
      background: #666;
      color: #fff;
      font-size: 40px;
      font-family: "Comic Sans MS", cursive;
      text-align: center;
      line-height: 100px;
      margin: 10px;
    }

    .aa>.aaa {
      display: inline-block;
      vertical-align: middle;
    }
  </style>

  <script type="text/javascript">
    $(document).ready(function () {
      $("#qq").click(function () {
        $.ajax({
          type: "POST",
          dataType: "text",
          url: "localhost",
          data: { text: 'PostTest' },
          success: function () {
            alert("SENd DaTa Successfully");
          }
        });
      });
    });

  </script>

</head>



<body>
  <div class="aa">
    <div class="aaa">
      <div class="aaaa" id="qq">
        Hello World
      </div>
    </div>
  </div>
</body>

</html>

2) 用纯粹的CSS+HTML画出下面这个图,背景图另附(请注意半透明图层的使用)
背景图

效果图

源码：

<html>

<head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>test1</title>

        <style>
                #dd {
                        width: 55px;
                        height: 55px;
                        background-color: #44667F;
                        color: white;
                        text-align: center;
                        border-radius: 100px;
                        /*-webkit-border-radius: 100px;*/
                        -moz-border-radius: 100px;
                }

                #ddd {
                        width: 240px;
                        height: 240px;
                        background-color: #CEDEDF;
                        color: white;
                        text-align: center;
                        border-radius: 300px;
                        /*-webkit-border-radius: 100px;*/
                        -moz-border-radius: 300px;
                }

                #dddd {
                        width: 320px;
                        height: 320px;
                        color: #ffffff;
                        background-color: #ffffff;
                        text-align: center;
                        border-radius: 300px;
                        /*-webkit-border-radius: 100px;*/
                        -moz-border-radius: 300px;
                }

                #wujiao {
                        width: 0;
                        height: 0;
                        margin: 300px 300px;
                        color: #f00;
                        position: relative;
                        display: block;
                        border-right: 100px solid transparent;
                        border-bottom: 70px solid #f00;
                        border-left: 100px solid transparent;
                        -moz-transform: rotate(35deg);
                        -webkit-transform: rotate(35deg);
                        -ms-transform: rotate(35deg);
                        -o-transform: rotate(35deg);
                }

                #wujiao:before {
                        width: 0;
                        height: 0;
                        position: absolute;
                        display: block;
                        top: -45px;
                        left: -65px;
                        border-bottom: 80px solid #f00;
                        border-left: 30px solid transparent;
                        border-right: 30px solid transparent;
                        content: '';
                        -webkit-transform: rotate(-35deg);
                        -moz-transform: rotate(-35deg);
                        -ms-transform: rotate(-35deg);
                        -o-transform: rotate(-35deg);
                }

                #wujiao:after {
                        width: 0;
                        height: 0;
                        position: absolute;
                        display: block;
                        top: 3px;
                        left: -105px;
                        color: #F00;
                        border-right: 100px solid transparent;
                        border-bottom: 70px solid #f00;
                        border-left: 100px solid transparent;
                        content: '';
                        -webkit-transform: rotate(-70deg);
                        -moz-transform: rotate(-70deg);
                        -ms-transform: rotate(-70deg);
                        -o-transform: rotate(-70deg);
                }

                #rectangle {
                        width: 300px;
                        height: 160px;
                        background-color: #ffffff;
                }

                #ppap {
                        filter: alpha(Opacity=90);
                        -moz-opacity: 0.9;
                        opacity: 0.6;
                }
        </style>
        <script type="text/javascript">

        </script>

</head>



<body background="Wechat_sm.png" style=" background-repeat:no-repeat ;background-size:100% 100%;
background-attachment: fixed;">
        <div id="ppap">
                <div id="dddd" style="position: fixed;top:140px; left: -100px; right: auto;  bottom: auto; ">
                </div>
                <div id="rectangle" style="position: fixed;top:220px; left: 198px; right: auto;  bottom: auto; ">
                </div>
        </div>
        <div id="ddd" style="position: fixed;top:180px; left: -60px; right: auto;  bottom: auto; ">
        </div>
        <div id="dd" style="position: fixed;top:160px; left: 30px; right: auto;  bottom: auto; ">
        </div>
        <div id="wujiao" style="position: fixed;top:-39px; left: -340px; right: auto;  bottom: auto; "></div>
        <div id="dd" style="position: fixed;top:260px; left: 145px; right: auto;  bottom: auto; ">
        </div>
        <div id="dd" style="position: fixed;top:380px; left: 30px; right: auto;  bottom: auto; ">
        </div>

</body>

</html>
Chris_mu
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
【渝粤题库】广东开放大学 服务标准化 形成性考核
渝粤题库
11-12 867
​????关注我,看答案???? 选择题 题目：以下关于本课程终考的描述正确的是？ 答案： A、终考成绩占总成绩的30%； B、考完后可以立刻知道终考成绩； C、终考也是在学习平台上考； D、终考可以在家考； E、本课程的终考是开卷考试； 题目：以下哪种方式能判断已发布的形考是否都做了？ 答案： A、去“课程指引”→“考核方式”/“教学安排”内看形考都有哪些 B、看课程首页里的所有活动后是否都有进度（方框内是否都有对勾） C、每次形考都点开看看，看是否有做 D、去课程首页左侧的“设置”→课程管理→成绩→“用
【渝粤题库】广东开放大学 商务网站建设与维护 形成性考核
渝粤题库
11-25 2535
选择题 题目：企业在电子商务网站中通过（ ），可以及时地收集、加工、处理、传递与利用相关的数据资料。 答案： A、商品订购信息管理系统 B、销售信息管理系统 C、商品数据库管理系统 D、客户信息管理系统 题目：HTML中表示文字粗体的标记除了使用< strong >外，还可以使用（ ）。 答案： A、< c > B、< d > C、< a > D、< b > 题目：目前企业的电子商务网站模式根据所采用的技术不同，可分为（ ）。 答案： A、基于We
JSP实现网上测试，包括填空题，单选题，多选题和判断题
06-09
本实验在NetBean环境下利用JSP技术编写一个网上测试程序，包含填空题、多选题、单选题和判断题，可以实现在线测试以及在线评分。
jsp考试题及答案
weixin_30508241的博客
07-04 1663
最近回家，没能上网，今天把答案贴出来，希望对大家有帮助。 一、填空(30分) 21 1、 Tomcat服务器的默认端口是 8080 。怎样修改tomcat的端口__在Tomcat下打开conf文件夹找到server.xml文件用记事本打开在<Connector port=”8080”>中把8080更改即可_____, 2、 异常的处理，可在该...
x1ct34m考核题分析
皮三宝好菜的博客
01-22 634
x1ct34m考核题分析 分析的是17届re方向的考核题 程序整体分析 跑一下看看，主要是一个加密器，在linux下运行，输入明文，输出密文。 拖进ida里，一开始根据字符串生成key 随后是一个对输入字符串的补位操作 紧接着再根据key生成一个keybox 然后进入主要加密段 最后return一个fake base64 下面看看主要加密段 看看sub400756 其实呢这是个Feiste...
Asp.net考核试题
qizhichao110的专栏
12-06 698
1.new有几种用法 第一种:new Class(); 第二种:覆盖方法 public new XXXX(){} 第三种:new 约束指定泛型类声明中的任何类型参数都必须有公共的无参数构造函数。 2.如何把一个array复制到arrayList里 foreach( object o in array )arrayList.Add(o); 3.datagrid.datasouse可以连
Java高级开发岗位笔试题和解析(一)
热门推荐
田宝宝的博客
04-14 1万+
Java高级开发岗位笔试题和解析(一)
计算机应用能力考核办公室官网,山东省计算机应用能力考核办公室.docx
weixin_39878688的博客
07-05 450
山东省计算机应用能力考核办公室.docx (10页) 本资源提供全文预览，点击全文预览即可全文预览,如果喜欢文档就下载吧，查找使用更方便哦！9.90 积分山东省计算机应用能力考核办公室《Windows XP应用技术》试题考生编号：11141200305考生姓名：aaa考试开始：2012-12-18 10:45考试结束：2012-12-18 11:45上次保存：2012-12-18 11:38:...
【渝粤题库】广东开放大学 现代服务学概论 形成性考核 (2)
渝粤题库
11-18 4171
选择题 题目：为什么需要课本？ 题目：以下哪种考核方式可以多次尝试，多次取得成绩，直到取得理想的分数？ 题目：你可以通过哪些方法联系到本课程的责任教师？ 题目：可以通过哪些形式登陆学校的课程平台进行学习？ 题目：“单元作业”提交很久了还没看到老师给成绩怎么办？ 题目：本课程的终考包含哪些题型？ 题目：什么时候会给“平时成绩”？ 题目：王鑫老师有什么怪癖？ 题目：2005年，（ ）整合陆家嘴72家服务业单位，成立了内地首家服务业行业协会。 题目：服务具有哪些特征 题目：以下哪种服务属于对人的不可触知的服务活动
电大Java语言与WWW技术形成性考核判断题.docx
06-14
Java语言具有高级特性，如简单性、安全性和面向对象。JRE在JDK安装时可选。'a'+0的结果是字符'a'，不是'a0'。double类型赋值可以加D或d后缀。while循环条件可以是boolean常量。javadoc用于生成API文档。if和switch...
智能网络考试系统源码版ASP+ACCESS
05-06
系统操作简单,题型丰富,广泛用于企事业单位,学校教育培训机构等在线考试,网络考试,在线考核等 系统主要功能： 1、设置基本考试系统信息(开通/关闭考试等) 2、自动化提交试卷，智能判断学生是否重复提交 3、支持题型...
校无忧在线考试系统 v3.4
04-21
系统操作简单,题型丰富,广泛用于企事业单位,学校教育培训机构等在线考试,网络考试,在线考核……校无忧在线考试系统主要功能：1、设置基本考试系统信息(开通/关闭考试等)2、自动化提交试卷，智能判断学生是否重复提交...
asp在线考试系统(asp+access实现)
04-04
一方面是为了促进计算机知识的普及和计算机应用技术的推广，另一方面是为劳动力市场服务，即为劳动人员提供其计算机应用知识与能力的证实，为用人部门录用和考核工作人员提供一个统一、客观、公正的评价标准. ...
青辰网络考试系统免费版 X2.0
10-18
系统操作简单,题型丰富,广泛用于企事业单位,学校教育培训机构等在线考试,网络考试,在线考核等系统主要功能：1、设置基本考试系统信息(开通/关闭考试等)2、自动化提交试卷，智能判断学生是否重复提交3、支持题型：单...
多测师肖sir_高级金牌讲师_面试题
多测师肖sir的博客
04-21 1万+
1、冒烟测试是什么意思？ 对主要功能，基本功能进行测试 2、你们公司的项目流程是什么？ （1）H模型 H模型：拿到需求=编写测试计划=编写测试用例用例评审导入用例管理工具搭建环境开发提交代码包（达到准入要求）部署代码包（代码包发环境中）冒烟测试通过sit1系统集成测试（全部的用例）发现bug提交给开发开发修改测试输出测试小结=开发提交第二次版本包冒烟测试=sit2系统集成测试以此类推达到准出要求=输出测试报告=通知uat验收测试=验收通过版本封装上线线上测试上线成功 3、你们公司的bug分几个级别？ 四个级
pear-admin-fast项目修改为集成PostgreSQL启动
07-15
pear-admin-fast项目修改为集成PostgreSQL的数据库备份（postgresql的数据结构备份）
Hadoop和Spark初学者指南：基础安装与实践应用 0基础！！易懂！！.html
最新发布
07-15
详细介绍了如何从基础安装到实践应用掌握Hadoop和Spark两大数据处理框架。文章首先概述了Hadoop和Spark的定义与功能，然后详细描述了环境准备，包括Java和Python的安装。接着，文章分步骤指导如何下载、安装及配置Hadoop和Spark，并通过示例展示了如何进行基本的操作和任务处理，如在Hadoop上上传和读取文件，在Spark上执行Word Count任务。此外，指南还提供了常见问题的解决方案，并建议了进一步学习的方向，帮助读者深入理解和高效应用这两款工具。本文适合初学者，旨在帮助他们快速上手并掌握大数据处理的基本技能。 Hadoop和Spark初学者指南Hadoop和Spark初学者指南Hadoop和Spark初学者指南Hadoop和Spark初学者指南Hadoop和Spark初学者指南Hadoop和Spark初学者指南Hadoop和Spark初学者指南Hadoop和Spark初学者指南Hadoop和Spark初学者指南Hadoop和Spark初学者指南Hadoop和Spark初学者指南Hadoop和Spark初学者指南Hadoop和Spark初学者指南Hadoo
最新网站ASP与SQL的课程报告.doc
07-15
数据库

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值