用纯html代码写TAB

html-css025

用纯html代码写TAB,第1张

纯html的意思至少应该有css和JS吧?两种解决方案:

方案1:多个标签,下面的DIV只需要一个,每切换到一个标签通过ajax获取相应数据,然后填充到div中,这个因为涉及到ajax你可能不会,所以跳过,用下一个

文案2:标签与下面的DIV一一对应,DIV默认先全部隐藏,切换到哪个标签就显示对应的DIV。

先来样式表

<style type="text/css">

    a{border:1px solid #f00margin:10pxpadding:10px}

    div.show{display:noneborder:1px solid #00fpadding:20pxmargin:20px}

</style>

再来html

<p>

<a>标签1</a><a>标签2</a><a>标签3</a>

</p>

<div class="show" id="show0">内容1</div>

<div class="show" id="show1">内容2</div>

<div class="show" id="show2">内容3</div>

JS脚本

$("p a").mouseover(function () {

        $(".show").hide()

        $("#show" + $(this).index()).fadeIn(500)

    })

HTML里没有Tab的代表字符,不过可以用<pre></pre>把你想定的内容包起来,它会保留你内容里面的Tab。

HTML被称为超文本标记语言。HTML文本是由描述文本、图形、动画、声音、表格、链接等的HTML命令组成的描述性文本。也就是Internet通常看到的web页面。

超文本标记语言是WWW的描述语言。设计HTML语言的目的是能够把文本或图形存储在一个电脑,另一台电脑中的文本或图形方便地连接在一起,形成一个有机的整体,人没有考虑特定信息是否对当前电脑或网络中的其他计算机。

我们只需用鼠标点击文档中的一个图标,互联网就会立即转到与该图标相关的内容,这些内容可能存储在网络上的另一台计算机上。

扩展资料:

超文本标记语言(HTML)文档制作不是很复杂,但功能强大,支持不同数据格式的文件插入,这是万维网(WWW)流行的原因之一,其主要特点如下:

1.简单性:超文本标记语言的版本以超集方式升级,更加灵活方便。

2.可扩展性:超文本标记语言的广泛应用带来了增强的功能和标识符的附加要求。超文本标记语言采用了子类元素来保证系统的可扩展性。

3.平台独立性:虽然现在个人电脑很流行,但也有很多人在使用其他机器,比如苹果电脑,而且超文本标记语言可以在很多平台上使用,这也是万维网(WWW)流行的另一个原因。

4.通用:此外,HTML是通用语言网络,是一种简单、通用的标记语言。它允许网络制作者创建文本和图像的复杂页面,任何人都可以在web上查看这些页面,无论使用何种类型的计算机或浏览器。

在一些网页或者说在弹出层的使用下,一般情况在ie浏览器下 我们都不希望使用tab 或者说

使用tab键后都会造成一定的问题,例如:

在弹出层后,tab键还可以在目页中操作,这回导致脚本错误。

那么我们如果避免这种情况呢?

通过键盘事件来控制

$(document).ready(function () {

$(document).bind('keydown', function (event) {

if (event.keyCode == 9) {

document.body.focus()

}

})

})

以上代码很熟悉 就是按tab键的时候 将焦点再次移到tabindex为0的上面

那么我们这时便需要在页面开始的时候 就设置初始化的页面焦点

例如下面用aspx写的例子:

在一些特殊的情况下 我们需要在页面加载的时候设置一下焦点的位置,以便防止 tabindex的设置会出现无效 或受其他因素的影响.