js学习之动态创建html元素 body{margin:0;padding:0;} .sky{background:#000;width:1000;height:500px; position:relative;} #s{ background:#FFF; width:1px; height:1px; overflow:hidden; position:absolute;} 没事造星星玩 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
DOCUMENT中的任一个标签： 1、getElementById() getElementById()可以访问DOCUMENT中的某一特定元素，顾名思义，就是通过ID来取得元素，所以只能访问设置了ID的元素。 比如说有一个DIV的ID为docid： <div id="docid"></div> 那么就可以用getElementById("docid")来获得这个元素。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>ById</title> <style type="text/css"> <!-- #docid{...
问题： 如何取到页面中任意某个Html元素与body元素之间的偏移距离？ offsetTop和offsetLeft 这两个属性,IE 、Opera和Firefox对它俩的解释存在差异： IE5.0+ 、Opera8.0+： offsetTop和offsetLeft 都是相对父级元素 Firefox1.06： offsetTop和offsetLeft 都是相对于body元素 因此： （1）在FF下直接使用offsetTop和offsetLeft，就可以取到页面中任意某个Html元素与body元素之间的偏移距离； （2）在IE、Opera下则比较麻烦： 需要首...
<script content="text/javascript"> var iMouseDown = false; var dragObject = null; Number.prototype.NaN0=function(){return isNaN(this)?0:this;} // Demo 0 variables var DragDrops = []; var curTarget = null; var lastTarget = null; function makeDraggable(item){ if(!item) return; item.onmousedown = function(ev){ dragObject = this; mouseOffset = getMouseOffset(this, ev); return false; ...
<style content="text/css"> li { MARGIN-BOTTOM: 10px } ul { MARGIN-TOP: 5px } .DragContainer { BORDER-RIGHT: #669999 2px solid; PADDING-RIGHT: 5px; BORDER-TOP: #669999 2px solid; PADDING-LEFT: 5px; FLOAT: left; PADDING-BOTTOM: 0px; MARGIN: 3px; BORDER-LEFT: #669999 2px solid; WIDTH: 100px; PADDING-TOP: 5px; BORDER-BOTTOM: #669999 2px solid } .OverDragContainer { BORDER-RIGHT: #669999 2px so...
本文实例讲述了ASP.NET动态增加HTML元素的方法。分享给大家供大家参考，具体如下： 在使用asp.net进行web开发的时候页面中的<head></head>中的信息可以通过asp.net的cs文件动态指定。 1、动态增加样式表 /*动态增加样式表*/ HtmlLink link = new HtmlLink(); link.Attributes.Add("type", "text/css"); link.Attributes.Add("rel", "stylesheet"); link.Attributes.Add("href", "/css/base.css"); this.Header.Controls.Add(link);...
1.用基本的文字元素标记内容 先看显示效果：对应HTML代码：XML/HTML Code复制内容到剪贴板<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Learn4Font</title> </head> <body> <p> 元素 b —— <b> I am the example.</b></p> <p> 元素 em —— <em> I am the example.</em></p> <p> 元素 i —— <i> I am the example.</i></p> <p> 元素 s —&mdas...
img元素允许我们在HTML文档里嵌入图像。 要嵌入一张图像需要使用src和alt属性，代码如下：<img src="../img/example/img-map.jpg" alt="Products Image" width="580" height="266" />显示效果：1 在超链接里嵌入图像 img元素的一个常见用法是结合a元素创建一个基于图像的超链接，代码如下：XML/HTML Code复制内容到剪贴板<a href="otherpage.html"> <img src="../img/example/img-map.jpg" ismap alt="Products Image" width=...
在网页中有很复杂的 HTML 结构，如果我们使用 CSS 来定义相关的样式，就需要为这些结构指定相应的标志，然后再编写相应的 CSS 选择器来获取他们赋予样式。最常用的两个标注属性就是 id 和 class 了，例如：XML/HTML Code复制内容到剪贴板<div class=”header” id=”header” ></div> 现在还有更多的选择方法，例如：属性选择器等。但是并不推荐使用，使用属性选择器虽然可以省略掉 id 和 class，但是存在 后...
有些时候我们需要根据某些条件来控制Web页面中的HTML元素显示还是隐藏，可以通过display或visibility来实现。通过下面的例子了解display和visibility的区别，简单的例子代码如下： 代码如下: <html> <head> <title>HTML元素的显示与隐藏控制</title> <script type="text/javascript"> function showAndHidden1(){ var div1=document.getElementById("div1"); var div2=document.getElementById("div2"); if(div1.style.display==bl...
我们在设计页面的时候，经常要把DIV居中显示，而且是相对页面窗口水平和垂直方向居中显示，如让登录窗口居中显示。 到现在为止，探讨了很多种方法。 HTML：XML/HTML Code复制内容到剪贴板<body> <div class="maxbox"> <div class="minbox align-center"></div> </div> </body> 效果图（下面几种方法效果图一样）：第一种： CSS绝对定位 主要利用绝对定位，再用margin调整到中间位置。 父元素：CSS Code复...
代码如下: <body <form action="" method="post" name="form1" > <input type="text" id="id" /> </form> </body> <script> function myfocus() { document.getElementById(id).focus(); } </script>
代码如下:wmode参数：transparent模式：可用z-index控制层级opaque模式：可用z-index控制层级window模式：flash层级在浏览器核心显示窗口之上，flash会盖住与他重合的html 情景1（可修改flash的wmode参数）修改wmode属性为，transparent或opaque DEMO如下： 代码如下:<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title> HTML元素遮挡Flash - 情景1 </title> <style> html, body, object, embe...
有些时候我们需要根据某些条件来控制Web页面中的HTML元素显示还是隐藏，可以通过display或visibility来实现。通过下面的例子了解display和visibility的区别，简单的例子代码如下： 代码如下: <html> <head> <title>HTML元素的显示与隐藏控制</title> <script type="text/javascript"> function showAndHidden1(){ var div1=document.getElementById("div1"); var div2=document.getElementById("div2"); if(div1.style.display==bl...
1,使用css代码如下: style="display:none;" 2.使用javascript代码如下: item.style.display=none;