设置类名的style,用.类名{}方式
(2)li:hover
li指文件中所有li,即无序列表项
(3)background
background指列表背景,一般指颜色
(4)HideBorder()
(5)none
none代表没有边框
(6)ShowBorder()
(7)5px double red
5px的红色双线
(8)ul
后面有/ul
(9)onclick
题目要求在点击时消除边框
(10)onmouseleave
这是鼠标离开某个元素时的事件
网页设计一般分以下步骤:1、平面设计,即效果图,工具有很多,比如PS,FW等。
2、代码实现,即参照效果图用代码写出静态页面,方法也有很多,比较容易用的工具就是DW。
3、实现后台管理,如果你知识需要静态页面即可,那么就把静态页面放一个文件夹内,然后放上相互的连接,如果需要网上可以访问到(即上线),那么你需要一个域名和后台管理。这后面就比较复杂了,看你想怎么经营你的网站。
网页设计的标准有很多,一般比较常见的标准有:
HTML标准,CSS3标准,新出现的HTML5标准,一般页面都遵循CSS3标准,
在规划网站目录结构时应遵循从大到小,从整体到细节的原则,也就是你要先规划好大的板块然后才来细分其中的分支,
版面布局一般是从上到下,从左到右
一般页面板块从上到下分别是:top (顶部)head(头部) nav(导航) banner(广告) mysite(我的位置)mian(主体) bottom(底部)copyright(版权)
.
HTML是超文本标记语言缩写即(Hypertext Markup Language)是超文本标记语言
HTML是一种规范,一种标准,它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件,通过在文本文件中添加标记符,可以告诉浏览器如何显示其中的内容(如:文字如何处理,画面如何安排,图片如何显示等)。
HTML文档基本机构如下:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
</body>
</html>
<!DOCTYPE>声明位于文档中的最前面的位置,处于 <html>标签之前。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范
html是超文本标记
<head>标签用于申明作者和搜索引擎
meta标签通常用来为搜索引擎robots定义页面主题,或者是定义用户浏览器上的cookie
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312">
表示本文件是HTML格式,使用GB2312编码,当你是UTF8或者BIG5的时候按照这个写就行
<link rel="stylesheet" type="text/css" href="style.css">
表示引入一个style.css文件
<META>不影响页面效果,只有是搜索引擎要认一下
<!DOCTYPE iframe PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "<html>
<head>
<style type="text/css">
ul { list-style:none
}
</style>
</head>
<body>
<!-- 计时按钮 -->
<div align="center" id="" class="">
<input type="button" value="开始答题"/>
<input type="text" id="">
</div>
<!-- 1~3题 单选 -->
<div id="" class="">
<ul>
<li>
1、吉泽明步漂亮不漂亮?
</li>
<li>&nbsp&nbsp&nbsp&nbsp
A. 好<input type="radio" name="timu1" value="A">&nbsp
B. 不好<input type="radio" name="timu1" value="B">&nbsp
C. 都行<input type="radio" name="timu1" value="C">&nbsp
D. 嗯<input type="radio" name="timu1" value="D">
</li>
</ul>
<ul>
<li>
2、吉泽明步漂亮不漂亮?
</li>
<li>&nbsp&nbsp&nbsp&nbsp
A. 好<input type="radio" name="timu2" value="A">&nbsp
B. 不好<input type="radio" name="timu2" value="B">&nbsp
C. 都行<input type="radio" name="timu2" value="C">&nbsp
D. 嗯<input type="radio" name="timu2" value="D">
</li>
</ul>
<ul>
<li>
3、吉泽明步漂亮不漂亮?
</li>
<li>&nbsp&nbsp&nbsp&nbsp
A. 好<input type="radio" name="timu3" value="A">&nbsp
B. 不好<input type="radio" name="timu3" value="B">&nbsp
C. 都行<input type="radio" name="timu3" value="C">&nbsp
D. 嗯<input type="radio" name="timu3" value="D">
</li>
</ul>
</div>
<!-- 4~6题 多选 -->
<div>
<ul>
<li>
4、以下明星你认识几个?(多选题)
</li>
<li>&nbsp&nbsp&nbsp&nbsp
A. 小泽玛利亚<input type="checkbox" name="timu4" value="A">&nbsp
B. 苍井空<input type="checkbox" name="timu4" value="B">&nbsp
C. 泷泽萝拉<input type="checkbox" name="timu4" value="C">&nbsp
D. 天海翼<input type="checkbox" name="timu4" value="D">&nbsp
</li>
</ul>
<ul>
<li>
5、以下明星你认识几个?(多选题)
</li>
<li>&nbsp&nbsp&nbsp&nbsp
A. 小泽玛利亚<input type="checkbox" name="timu5" value="A">&nbsp
B. 苍井空<input type="checkbox" name="timu5" value="B">&nbsp
C. 泷泽萝拉<input type="checkbox" name="timu5" value="C">&nbsp
D. 天海翼<input type="checkbox" name="timu5" value="D">&nbsp
</li>
</ul>
<ul>
<li>
6、以下明星你认识几个?(多选题)
</li>
<li>&nbsp&nbsp&nbsp&nbsp
A. 小泽玛利亚<input type="checkbox" name="timu6" value="A">&nbsp
B. 苍井空<input type="checkbox" name="timu6" value="B">&nbsp
C. 泷泽萝拉<input type="checkbox" name="timu6" value="C">&nbsp
D. 天海翼<input type="checkbox" name="timu6" value="D">&nbsp
</li>
</ul>
</div>
<!-- 7~9题 填空 -->
<div>
<ul >
<li>
7、你最喜欢的明星是哪些?<INPUT TYPE="text" id="timu7" style="width:300border:noneborder-bottom:1px solid #005background:transparent">
</li>
<li>
8、你最喜欢的明星是哪些?<INPUT TYPE="text" id="timu8" style="width:300border:noneborder-bottom:1px solid #005background:transparent">
</li>
<li>
9、你最喜欢的明星是哪些?<INPUT TYPE="text" id="timu9" style="width:300border:noneborder-bottom:1px solid #005background:transparent">
</li>
</ul>
</div>
<!-- 10题 简答 一题12分,超过10个字给三分,有三个符合答案的关键词给12分 -->
<div>
<ul>
<li>
10、你对以上明星的评价如何
</li>
<li>
<textarea id="timu10" style="resize:nonewidth:500pxheight:100px" ></textarea>
</li>
</ul>
</div>
<!-- 提交按钮和自动判分对话框 -->
<div align="center">
<input type="button" value="提交" onclick="sub()"/>
<script type="text/javascript">
function sub(){
var key = new Array()
key.push("")
var grade = 0
key.push("A")
key.push("B")
key.push("D")
var timu1 = document.getElementsByName("timu1")
for(var i=0 i<timu1.length i ++){
if(timu1[i].checked){
timu1 = timu1[i].value
}
}
if(timu1==key[1]){
grade = grade+2
}
alert(grade)
}
</script>
</div>
</body>
</html>
剩下的都差不多,不懂再追
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)