HTML实用的网页代码大全[通俗易懂]

HTML实用的网页代码大全[通俗易懂]【一】:符号<p>段落</p> <h>标题</h>(h1—h6) <br>:换行 <hr>:分割线 左右尖括号:<> &表示为:&amp "表示为:" 表格形式<table>

大家好,又见面了,我是你们的朋友全栈君。

【一】:符号

  1. <p>段落</p>
  2. <h>标题</h>(h1—h6)
  3. <br>:换行
  4. <hr>:分割线
  5. 左右尖括号:&lt;&gt;
  6. &表示为:&amp
  7. “表示为:&quot;
  8. 表格形式
  • <table>
  • <thead></thead>
  • <tbody><tr><td></td></tr></tbody>
  • <tfoot></tfoot>
  • </table>

【二】:字体

  1. 移动字体(走马灯):<marquee>文字</marquee>
  2. 字体加粗:<b>文字</b>
  3. 字体斜体:<i>文字</i>
  4. 字体下划线:<u>文字</u>
  5. 字体删除线:<s>文字</s>
  6. 字体加大:<big>文字</big>
  7. 字体控制大小:<h1>文字</h1>(其中字体大小可以从h1—h6)
  8. 字体控制大小:<font  size=”12px”>文字</font>
  9. 字体控制颜色:<font  color=”颜色”>文字</font>(颜色的表示方式:方式一:英语单词表示;方式二:#000000~#ffffff)
  10. 字体控制颜色:<p style=”color: 颜色”>文体</p>(颜色的表示方式:方式一:英语单词表示;方式二:#000000~#ffffff)
  11. 原始字体样式:<pre>文字</pre>

【三】:body标记的属性

属性 功能
background 控制网页背景(如:颜色,背景图大小等)
color 控制字体颜色
font 控制字体属性(如:字体)

【四】:特殊样式

  1. 在新窗口打开连接:<a href=”要跳转的目标路径” target=”_blank”>要输入的文字</a> (target=_blank表示用新窗口打开页面,一般出现在<a>标签中,target表示链接在哪里打开,可以为它赋已经存在的窗口名或者一些默认的值,常见的一些默认的值有:_blank   新窗口       _self    自身          _parent  父窗口    _top     顶层窗口(框架中))
  2. 消除下划线的连接:<a href=”要跳转的目标路径” style=”text-decoration: none” target=”_blank”>要输入的文字</a>
  3. 贴音乐:<embed src=”音乐地址” width=”宽度” height=”高度” type=audio/mpeg autostart=”false”>
  4. 贴网页:<iframe src=”网页地址” width=”宽度” height=”高度”></iframe>
  5. 贴flash:<embed src=”flash地址” width=”宽度” height=”高度”>
  6. 贴影视文件:<img dynsrc=”文件地址” width=”宽度” height=”高度” start=mouseover>
  7. 固定帖子背景不随滚动条滚动:<body background=”背景图片地址” body bgproperties=fixed>
  8. 帖子背景颜色:<body bgcolor=”颜色”> (颜色的表示方式:方式一:英语单词表示;方式二:#000000~#ffffff)
  9. 帖子背景音乐:IE:<body bgsound=”背景音乐地址” loop=infinite>或NS:<embed src=”背景音乐文件” autostart=true hidden=true loop=true>      (bgsound是背景音乐的标签  src-所插入背景的URL(网址)。 loop-设置循环的次数,当值是-1或者Infinite 的时候表示无限循环。 volume-音量,值为-10000到0之间,(不算直观)0是最大音量。 balance-声道,值为-1000到1000之间的值,负值将声音发送左声道,正值将声音发送右声道,0为立体声。 delay-是进行播放延时的设置)
  10. 贴网页:<iframe src=”目标地址” width=”宽度” height=”高度”></iframe>
  11. 忽略右键:<body οncοntextmenu=”return false”>和<body style=”overflow-y:hidden”>
  12. 拉动页面时背景图不动:
    body{
        background-image: url("123.gif");
        background-repeat: no-repeat;
        background-position: center;
    }
  13. 让浏览器保存页面失败:<NOSCRIPT><iframe src=”*.html”></iframe></NOSCRIPT>
  14. 窗口定时关闭:
  15. <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>方式一</title>
        <script language="JavaScript">
            function colseit() {
                setTimeout("self.close()",10000)
            }
        </script>
    </head>
    <body onload="colseit()">
    <p>我爱学习</p>
    <p>学习爱我</p>
    <p>沉迷学习</p>
    <p>无法自拔</p>
    </body>
    </html>
    <-------------------------------------------------------->
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>方式二</title>
        <style type="text/css"></style>
    </head>
    <body onload="setTimeout(window.close,3000)">
    <p>我爱学习</p>
    <p>学习爱我</p>
    <p>沉迷学习</p>
    <p>无法自拔</p>
    </body>
    </html>
    <-------------------------------------------------------->
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>方式三</title>
    </head>
    <body bgcolor="f0d070" vlink="3300fc">
    <table border="0" width="288">
        <tr>
            <td class="cc1">自动关闭窗口示例</td>
        </tr>
    </table>
    <script language="JavaScript">
        function clock() {
            i=i-1;
            document.title="本窗口将在"+i+"秒后自动关闭";
            if(i>0) setTimeout("clock()",1000);
            else self.close();
        }
        var i=10;
        clock();
    </script>
    </body>
    </html>

    网页自动刷新:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>网页自动刷新</title>
        <meta http-equiv="refresh" content="5">
        <!--5为5秒后自动刷新-->
    </head>
    <body>
    <p>我爱学习</p>
    <p>学习爱我</p>
    <p>沉迷学习</p>
    <p>无法自拔</p>
    </body>
    </html>
  16. 网页自动跳转:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>网页自动跳转</title>
        <meta http-equiv="refresh" content="5;URL=demo1.html">
        <!--5秒后自动跳转-->
    </head>
    <body>
    <p>哈哈</p>
    </body>
    </html>
  17. 返回上一页:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>返回上一页</title>
    </head>
    <body>
    <a href="javascript:history.back(1)">【返回上一页】</a>
    </body>
    </html>
  18. 关闭窗口:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>方式一</title>
        <script type="text/javascript">
            function show() {
                alert("点击【确定】将自动关闭窗口");
                window.opener=null;
                window.open("","_self");
                window.close();
            }
        </script>
    </head>
    <body onload="show()">
    <p>我爱学习</p>
    <p>学习爱我</p>
    <p>沉迷学习</p>
    <p>无法自拔</p>
    </body>
    </html>
    <----------------------------------------------------->
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>方式二</title>
    </head>
    <body>
    <a href="javascript:self.close()">【关闭窗口】</a>
    </body>
    </html>
  19. 取消选取:<body onselectstart=”return false”>

  20. 防止复制:<body οnpaste=”return false”>

  21. 防止粘贴:<body onselectstart=”return false”>

  22. 取消选取:<body onselectstart=”return false”>

  23. 删除时确认:<a href=”javascript:if(confirm(‘确定要删除吗?’))location=’boos.asp?&areyou=删除&page=1′”>删除</a>

  24. 将IE地址栏前换成自己设定的图标:<link rel=”Shortcut Icon” href=”biaozhi1.ico”>(放在<head></head>之间)

  25. 在收藏夹显示自己设定的图标:<link rel=”Bookmark” href=”biaozhi1.ico”>(放在<head></head>之间)

  26. 永远带着框架:

    <script language="JavaScript">
            if(window==top){top.location.href="框架地址";}
        </script>
  27. 简单的页面加密:

  28. <script language="JavaScript">
            function loopy() {
                var sWord="";
                while(sWord!="login"){
                    sWord=prompt("请输入你的登录密码");
                    alert("登陆成功!");
                }
                loopy();
            }
        </script>

     禁止使用Shift,Ctrl,Alt功能键:

    <script>
            function look() {
                if(event.shiftKey){alert("禁止使用Shift键")}
                if(event.altKey){alert("禁止使用Alt键")}
                if(event.ctrlKey){alert("禁止使用Ctrl键")}
            }
            document.onkeydown=look;
        </script>
  29. 取消竖条滚动条:<body style=”overflow: scroll;overflow-y: hidden”>

  30. 取消横条滚动条:<body style=”overflow: scroll;overflow-x: hidden”>

  31. 取消滚动条(横条和竖条):<body scroll=”no”>

  32. 设定打开页面大小:<body οnlοad=”top.resizeTo(宽度,高度)”>

  33. 电子邮件处理提交表单:

    <form name="form1" method="post" action="mailt****@***.com" enctype="text/plain">
        <input type="submit">
    </form>
  34. 检查一段字符串是否全由数字组成:

    <script language="JavaScript">
            function checkNum(str) {
                return str.match()==null;
            }
            alert(checkNum("121312312312"));
            alert(checkNum("190900m2312"))
        </script>
  35. 改变光标形状:<span style=”cursor: move”>Auto</span>

指针样式图

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/136294.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • 三种查看MySQL数据库版本的方法

    三种查看MySQL数据库版本的方法

    2021年10月18日
  • js中的prototype有什么作用?[通俗易懂]

    js中的prototype有什么作用?[通俗易懂]1、prototype对象是实现面向对象的一个重要机制。每个函数也是一个对象,它们对应的类就是function,每个函数对象都具有一个子对象prototype。Prototype表示了该函数的原型,prototype表示了一个类的属性的集合。当通过new来生成一个类的对象时,prototype对象的属性就会成为实例化对象的属性。下面以一个例子来介绍prototype的应用,代码如下:123456…

  • 进程处于挂起状态表示_挂起进程转换图

    进程处于挂起状态表示_挂起进程转换图文章目录引言挂起状态是什么?挂起状态和阻塞状态有什么区别?如何主动挂起程序总结引言以前对于这个概念始终比较模糊,遂在解决后记录博客,希望帮助到有同样问题的朋友。挂起状态是什么?我们一般认为进程有五个状态,即新建态,就绪态,阻塞态,运行态,终止态。而在这些状态之外还存在着一个状态,我们称之为挂起状态,它既可以是我们客户主动使得进程挂起,也可以是操作系统因为某些原因使得进程挂起。总而言之引入挂起状态的原因有以下几种:用户的请求:可能是在程序运行期间发现了可疑的问题,需要暂停进程。父进程的请求:

    2022年10月29日
  • 分页 模糊查询「建议收藏」

    分页 模糊查询「建议收藏」一、所有的web项目都会用到分页显示和模糊查询,对于有些人不知道该怎么写二、今天我用springMVC和myBatis写的分页和模糊分享给大家,不喜勿喷三、数据库是mysql四、其实写分页就是新建一个分页的类,定义页码每页数量共几页当前页数总数量五、判断多少页,获取总数量除以每页显示的数量,有余数+1页六、sql语句就是用…

  • 虚拟机连不上网问题详解「建议收藏」

    虚拟机连不上网问题详解「建议收藏」虚拟机连不上网问题详解第一虚拟机导航栏–编辑–虚拟机网络编辑器–VMnet0桥接模式(Inter(R)Wireless—AC9462)第二虚拟机导航栏–虚拟机–设置–网络适配器–NAT模式(VMnet0)–确定第三自己windows系统–服务–确保VMware开头的五个服务全部开启,并设置成自动开启最后打开虚拟机终端输入命令(重启网络服务)servicenetworkrestart我的是出现下面状态 [root@localhost~]#servicenetw

  • 【MongoDB数据库】怎样安装、配置MongoDB

    【MongoDB数据库】怎样安装、配置MongoDB

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号