发布一个以前学习html时候的总结

2023-05-09    分类: 网站建设

以下是以前学习html时候总结的一些短语和方法,包括一些html使用技巧,希望大家认真阅读后有所帮助。

<a href="#"></a>
<a href="html.exe"></a>
<a href="mailto:icyzhl@163.com?cc=icyzhl@126.com&subject='你好'&body='你好啊'"></a>
<a href="#ffff"></a>
<a name="ffff"></a>
<a href="javascript:alert('你好')"></a>
<a href="####"></a>
<a href="javascript:void(0)"></a>
<a href="javascript:void(null)"></a>
<a href="javascript:;"></a>
<a href="#" onclick="return false"></a>
<span style="cursor:hand"></span>
a:link {font-size:12px;color:red;text-decoration:none;font-style:italic}
a:link {font-size:14px;color:red;font-weight:normal;text-decoration:underline;font-style:normal}
a:link {font-size:12px;font-family:华文行楷;font-weight:bolder;color:red;text-decoration:overline}
style="writing-mode:tb-rl"
style="writing-mode:lr-tb"
<form>
<select onchange="document.body.style.background=this.options[this.selectedIndex].value">
<option value=url(1.jpg)>背景1
<option value=url(2.jpg)>背景2
<option value=url(3.jpg)>背景3
</select></form>
调用css
favicon
<link href="" rel="shortcut icon">
<link href="" rel="bookmark">
<link href="css文件地址" rel="stylesheet">
<style type="text/css">
在此写css
</style>
<span style="css样式内容"></span>
<style style="text/css">
@import url("")
</style>
text-decoration:none
text-decoration:overline
text-decoration:underline
text-underline-position:above/below(IE专有属性)
text-decoration:line-through
text-transform:uppercase/lowercase/capitalize
font-size:大小
font-family:字体
font-style:normal/italic
font-weight:normal/bold/bolder/lighter
line-height:120%
writing-mode:tb-rl/lr-tb
text-indent:?px
综合 font:样式 变形 加粗 字号/行高 字体
example----font:italic bold 12px/120% 华文行楷

定义 调用

.css1 {} class=css1
#css2 {} id=css2
table {} 说明table 中的所有属性
table#css1 {} table中的所有css1都有这个属性 id=css1
table.css1 {} table中的所有css1都有这个属性 class=css1
body,table,input {} table和body和input都有这个属性
table #css1 table中其他标签拥有的属性 <table>...<span id=css1
table .css1 table中其他标签拥有的属性 <table>...<span class=css1

image:
vaspace hspace width heigth dynsrc src lowsrc alt

form :
input type="text/password/radio/checkbox/sunmit/file/hidden/botton"
select option
textarea
onmouseover="this.focus() onfocus=this.select()"
onmouseover="this.value=''"

font:
i b u strike &lt; &gt; &amp; &quot;&apos; &reg; &copy

在网页中加入html代码只要在代码前后加入:<xmp>和</xmp>就可以了

size color

basefont color:red;... base href="" base target="_top"

table td tr:
align=center/right/left leftmargin topmargin cursor oncontentmenu
ondragstart oncopy oncut onpaste onselectstart bgcolor background
width heigth id cellpadding cellspacing border

bgsound:
loop=-1/infinite balance volume autostart

marquee:
direction:up/down/left/right
align:center/right/left/right
behavior:scroll slide alternate
vspace hspace height width bgcolor
scrolldelay scrollamount

<span title="你好">你好</span>
<span onmouseout="window.status=''" onmouseover="window.status='你好'" style="cursor:hand"></span>

favicon <link href="" rel="shortcut icon">

oncontextmenu="return false"
ondraystart="return false"
onselectstart="return false"
oncopy="return false"
onpaste="return false"
oncut="return false"

<meta http-equiv="refresh" content="5;url=http://www.baidu.com"
<meta name="description" content="内容"
<meta name="keywords" conternt="内容"
<meta name="author" content="张虹亮"
<meta http-equiv="page-enter" content="revealtrans(duration='3';transition='23')"
<meta http-equiv="page-exit" content="revealtrans(duration='3';transition='23')"
<meta http-equiv="content-type" content="text/html;charset=gb2312"

取消表单按下时的虚线
<input type=radio hidefocus=true name=sex>你好
<input type=radio name=sex onfocus="this.blur()">你不好

加入收藏:
<form>
<input type="submit" onclick="window.external.addfavorite('http://www.softku.com.cn','软酷下载')"></form>

a的全写:anchor

<base target="_top">防止点击链接时新窗口都是在顶部打开

<p><br>比<br><p>多一行

如何让网页中的广告自动关闭:
---在网页广告条的网页head和/head中加入:
<script language="javascript">

function close(){
setTimeout("self.close()",5000)
}//本网页自动在5秒钟关闭
</script>
或者:
function close(){
self.close()
}
setinterval("close()",5000)
</script>

frameset frame iframe:
border bordercolor src name rows cols framespacing frameborder

flash透明:
<param name="wmode" value="transparent">

半透明的表格:
<table cellpadding=0 cellspacing=0 width=200 height=100><tr><td style="background-color:red;filter:alpha(opacity=20)">&nbsp;</td></tr></table>

阴影表格:
<div style="filter:shadow(color=red,direction=120);width=200;padding-right:10;padding-bottom:10">
<table cellpadding=0 cellspacing=0 width=200 height=100 bgcolor=red><tr><td>&nbsp;</td></tr></table></div>

特色的表单:
<form>
<input type="button" value="空的" disabled>
<input type="text" value="520" readonly>
<input type="text" size=30 style="border-top:1px dashed red;border-bottom:1px dashed black;border-right:1px dashed blue;border-left:1px dashed orange;"
</form>

<embed src="" width height>
<bgsound src="" loop=-1/infinite autostart=false/true>
<param name="wmode" value="transparent">

背景更换效果
<style type="text/css">
.css1 {background-image:url("1.jpg")}
.css2 {background-image:url("2.jpg")}
</style>
<table><tr><td onmouseout="this.className='css1'" onmouseover="this.className='css2'">sage</td></tr></table>

关闭网页
<script language="javascript">
function closewindow(){
window.opener=null
window.close()
}
</script>
调用:<form><input type="button" onclick="javascript:closewindow()"></form>

鼠标指向时变背景颜色的表格
<table cellpading=0 cellspacing=1 bgcolor=red width=100 height=20><tr><td onmouseover="this.bgColor='#efefef'" onmouseout="this.bgColor='#333333'" bgcolor="#ffffff"></td></tr></table>

细线表格1:
<table cellpading=0 cellspacing=1 bgcolor=red width=100 height=20><tr><td bgcolor="#fffff"></td></tr></table>

细线表格2:
<table border=1 bordercolor="#000000" width=100 height=20><tr bordercolor="#ffffff"><td></td></tr></table>

细线表格3:
<input type="text" size=12 readonly="readonly">
<input type="text" size=12 disabled="disabled">

凹下的立体表格:
<table width="100" border="1" cellspacing="1" cellpadding="0" bgcolor=red>
<tr><td bgcolor="#ff3333">&nbsp;&nbsp;</td><td bgcolor="#ff3333">&nbsp;&nbsp;</td></tr>
<tr><td bgcolor="#ff3333">&nbsp;&nbsp;</td><td bgcolor="#ff3333">&nbsp;&nbsp;</td></tr>
<tr><td bgcolor="#ff3333">&nbsp;&nbsp;</td><td bgcolor="#ff3333">&nbsp;&nbsp;</td></tr>
</table>

凸出的立体表格:
<table width="100" border="1" cellspacing="0" cellpadding="0" bordercolorlight=#333333 bordercolordark=#efefef>
<tr><td bgcolor="#FF0000">&nbsp;&nbsp;</td><td bgcolor="#FF0000">&nbsp;&nbsp;</td></tr>
<tr><td bgcolor="#FF0000">&nbsp;&nbsp;</td><td bgcolor="#FF0000">&nbsp;&nbsp;</td></tr>
<tr><td bgcolor="#FF0000"">&nbsp;&nbsp;</td><td bgcolor="#FF0000">&nbsp;&nbsp;</td></tr>
</table>

有间距的表格:
<table width="100" border="1" cellspacing="5" cellpadding="0" bgcolor=gray>
<tr><td bgcolor="#999999">&nbsp;&nbsp;</td></tr>
</table>

<link rel="Shortcut Icon" href="favicon.ico"> IE地址栏前换成自己的图标

<link rel="Bookmark" href="favicon.ico"> 可以在收藏夹中显示出你的图标

<input style="ime-mode:disabled"> 关闭中文输入法

防止别人frame你的网页:
<script language="javascript">
if(top.location!=self.location){
top.location=self.location
}
</script>

1. oncontextmenu="window.event.returnValue=false" 将彻底屏蔽鼠标右键
<table border oncontextmenu=return(false)><td>no</table> 可用于Table

2. <body onselectstart="return false"> 取消选取、防止复制

3. onpaste="return false" 不准粘贴

4. oncopy="return false;" oncut="return false;" 防止复制

5. <link rel="Shortcut Icon" href="favicon.ico"> IE地址栏前换成自己的图标

6. <link rel="Bookmark" href="favicon.ico"> 可以在收藏夹中显示出你的图标

7. <input style="ime-mode:disabled"> 关闭输入法

8. 永远都会带着框架

<script language="JavaScript"><!--
if (window == top)top.location.href = "frames.htm"; //frames.htm为框架网页
// --></script>

9. 防止被人frame

<SCRIPT LANGUAGE=JAVASCRIPT><!--
if (top.location != self.location)top.location=self.location;
// --></SCRIPT>

10. 网页将不能被另存为

<noscript><iframe src=*.html></iframe></noscript>

11. <input type=button value=查看网页源代码
onclick="window.location = 'view-source:'+ 'http://www.cdcxhl.com/'">

12.删除时确认

<a href='javascript:if(confirm("确实要删除吗?"))location="boos.asp?&areyou=删除&page=1"'>删除</a>
<a href="return confirm("确认删除吗?")"

13. 取得控件的绝对位置

//Javascript
<script language="Javascript">
function getIE(e){
var t=e.offsetTop;
var l=e.offsetLeft;
while(e=e.offsetParent){
t+=e.offsetTop;
l+=e.offsetLeft;
}
alert("top="+t+"/nleft="+l);
}
</script>

//VBScript
<script language="VBScript"><!--
function getIE()
dim t,l,a,b
set a=document.all.img1
t=document.all.img1.offsetTop
l=document.all.img1.offsetLeft
while a.tagName<>"BODY"
set a = a.offsetParent
t=t+a.offsetTop
l=l+a.offsetLeft
wend
msgbox "top="&t&chr(13)&"left="&l,64,"得到控件的位置"
end function
--></script>

14. 光标是停在文本框文字的后

<script language="javascript">
function cc()
{
var e = event.srcElement;
var r =e.createTextRange();
r.moveStart('character',e.value.length);
r.collapse(true);
r.select();
}
</script>
<input type=text name=text1 value="123" onfocus="cc()">

15. 判断上一页的来源

javascript:document.referrer

16. 小化、大化、关闭窗口

<object id=hh1 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">
<param name="Command" value="Minimize"></object>
<object id=hh2 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">
<param name="Command" value="Maximize"></object>
<OBJECT id=hh3 classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11">
<PARAM NAME="Command" VALUE="Close"></OBJECT>

<input type=button value=小化 onclick=hh1.Click()>
<input type=button value=大化 onclick=hh2.Click()>
<input type=button value=关闭 onclick=hh3.Click()>
本例适用于IE

17.屏蔽功能键Shift,Alt,Ctrl

<script>
function look(){
if(event.shiftKey)
alert("禁止按Shift键!"); //可以换成ALT CTRL
}
document.onkeydown=look;
</script>

18. 网页不会被缓存

<META HTTP-EQUIV="pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
或者<META HTTP-EQUIV="expires" CONTENT="0">

19.怎样让表单没有凹凸感?

<input type=text style="border:1 solid #000000">

<input type=text style="border-left:none; border-right:none; border-top:none; border-bottom: 1 solid #000000"></textarea>

20.<div><span>&<layer>的区别?

<div>(division)用来定义大段的页面元素,会产生转行
<span>用来定义同一行内的元素,跟<div>的唯一区别是不产生转行
<layer>是ns的标记,ie不支持,相当于<div>

21.让弹出窗口总是在后面:

<body onblur="this.focus();">

22.不要滚动条?

让竖条没有:
<body style='overflow:scroll;overflow-y:hidden'>
</body>
让横条没有:
<body style='overflow:scroll;overflow-x:hidden'>
</body>
两个都去掉?更简单了
<body scroll="no">
</body>

23.怎样去掉图片链接点击后,图片周围的虚线?

<a href="#" onFocus="this.blur()"><img src="logo.jpg" border=0></a>

24.电子邮件处理提交表单

<form name="form1" method="post" action="mailt****@***.com" enctype="text/plain">
<input type=submit>
</form>

25.在打开的子窗口刷新父窗口的代码里如何写?

window.opener.location.reload()

26.如何设定打开页面的大小

<body onload="top.resizeTo(300,200);">
打开页面的位置<body onload="top.moveBy(300,200);">

27.在页面中如何加入不是满铺的背景图片,拉动页面时背景图不动

<STYLE>
body
{background-image:url(logo.gif); background-repeat:no-repeat;

background-position:center;background-attachment: fixed}
</STYLE>

28. 检查一段字符串是否全由数字组成

<script language="Javascript"><!--
function checkNum(str){return str.match(//D/)==null}
alert(checkNum("1232142141"))
alert(checkNum("123214214a1"))
// --></script>

29. 获得一个窗口的大小

document.body.clientWidth; document.body.clientHeight

30. 怎么判断是否是字符

if (/[^/x00-/xff]/g.test(s)) alert("含有汉字");
else alert("全是字符");

31.TEXTAREA自适应文字行数的多少

<textarea rows=1 name=s1 cols=27 onpropertychange="this.style.posHeight=this.scrollHeight">
</textarea>

32. 日期减去天数等于第二个日期

<script language=Javascript>
function cc(dd,dadd)
{
//可以加上错误处理
var a = new Date(dd)
a = a.valueOf()
a = a - dadd * 24 * 60 * 60 * 1000
a = new Date(a)
alert(a.getFullYear() + "年" + (a.getMonth() + 1) + "月" + a.getDate() + "日")
}
cc("12/23/2002",2)
</script>

33. 选择了哪一个Radio

<HTML><script language="vbscript">
function checkme()
for each ob in radio1
if ob.checked then window.alert ob.value
next
end function
</script><BODY>
<INPUT name="radio1" type="radio" value="style" checked>Style
<INPUT name="radio1" type="radio" value="barcode">Barcode
<INPUT type="button" value="check" onclick="checkme()">
</BODY></HTML>

34.脚本永不出错

<SCRIPT LANGUAGE="JavaScript">
<!-- Hide
function killErrors() {
return true;
}
window.onerror = killErrors;
// -->
</SCRIPT>

35.ENTER键可以让光标移到下一个输入框

<input onkeydown="if(event.keyCode==13)event.keyCode=9">

网页标题:发布一个以前学习html时候的总结
转载注明:https://www.cdcxhl.com/news15/258665.html

成都网站建设公司_创新互联,为您提供全网营销推广网站设计网站改版小程序开发虚拟主机关键词优化

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联

商城网站建设