html 基础代码

一、HTML各种命令的代码:


文本标签(命令)
  <pre>内容</pre>         创建预格式化文本
  <h1>内容</h1>          创建最大的标题
  <h6>内容</h6>          创建最小的标题
  <b>内容</b>           创建黑体字
  <i>内容</i>           创建斜体字
  <tt>内容</tt>          创建打字机风格的字体
  <cite>内容</cite>        创建一个引用,通常是斜体
  <em>内容</em>          加重一个单词(通常是斜体加黑体)
  <strong>内容</strong>      加重一个单词(通常是斜体加黑体)
  <font size=?>内容</font>     设置字体大小,从 1 到 7

  <font color=?>内容</font>    设置字体的颜色,使用名字或下面的色码。


文字的边外加光辉效果代码:
<div style="FILTER: Glow(color=#0000ff,strength=12); HEIGHT: 6pt"> <FONT style="FONT-SIZE: 60pt;FONT-FAMILY:隶书; COLOR: #ffff00"> 如画江山</FONT></div> 


文字重叠效果代码1:
<DIV style="FILTER: shadow(color=#00ff00, strength=5); WIDTH: 600px"><FONT style="FONT-WEIGHT: normal; FONT-SIZE: 50pt; LINE-HEIGHT: normal; FONT-STYLE: normal; FONT-VARIANT: normal" face=华文行楷 color=#808000> 期待您的精采! </FONT></DIV> 


文字重叠效果代码2:
<DIV style="FILTER: shadow(color=#000000, strength=5); WIDTH: 700px"><FONT style="FONT-WEIGHT: normal; FONT-SIZE: 80pt; LINE-HEIGHT: normal; FONT-STYLE: normal; FONT-VARIANT: normal" face=华文行楷 color=#ff0000> 春风秋雨 </FONT></DIV> 

凹陷文字

<div style='"width:300px; padding:20px;overflow:hidden;word-wrap:break-word;word-break:break:all;font-size:12px;line-height:18px;background-color:#eeeeee;">

<font disabled>

陷下去了嘛~~<br>

^_#<br>

<a href="http://www./">www.</a></font>

</div>

文字有颜色背景的代码:
<font STYLE="background-color:#0000ff" font face=黑体 style="FONT-SIZE: 22pt; color=#FFECEC"><b> 〖文字有颜色背景的代码〗</font></b>

文字靠左竖排代码:
<p> <font style="WRITING-MODE: tb-rl"style=font:14pt color=0000ff> 更喜岷山千里雪,<br> 三军过后尽开颜。<br> .....<br> </FONT></P>


文字居中竖排代码:
<p align=CENTER> <font style="WRITING-MODE: tb-rl"style=font:14pt color=0000ff> 更喜岷山千里雪,<br> 三军过后尽开颜。<br> .....<br> </FONT></P>


文字靠右竖排代码:
<p align=RIGHT> <font style="WRITING-MODE: tb-rl"style=font:14pt color=0000ff> 更喜岷山千里雪,<br> 三军过后尽开颜。<br> .....<br> </FONT></P>


全屏及图框代码

     1.全屏(相对定位)代码: 
     <DIV id=table1 style="LEFT: 0px; WIDTH: 900px; POSITION: relative; TOP: 20px">
     </DIV><br><br>
    2颜色背景图框代码.
     <TABLE borderColor="边框颜色代码" cellSpacing=15 cellpadding=20 bgColor="图框背景颜色代码" width="图框宽度" height="图框高度" border=20>
     <TR><<TD>
     </TD></TR></TABLE>
    3图片背景的图框代码.
     <TABLE borderColor="边框颜色代码" cellSpacing=15 cellpadding=20 background="背景图片地址" width="图框宽度" height="图框高度" border=20>
     <TR><<TD>
     </TD></TR></TABLE>






图形(命令)
  <img original="name">       添加一个图像
  <img original="name" align=?>   排列对齐一个图像:左中右或上中下
  <img original="name" border=?>  设置围绕一个图像的边框的大小
  <hr>             加入一条水平线
  <hr size=?>         设置水平线的大小(高度)
  <hr width=?>         设置水平线的宽度(百分比或绝对像素点)
  <hr noshade>         创建一个没有阴影的水平线 






链接(命令)
  <a href="网址">连接名称</a> 创建一个超链接
  <a href="电子邮箱">连接</a> 创建一个自动发送电子邮件的链接 
  <a name="NAME"></a>     创建一个位于文档内部的靶位 
  <a href="#NAME"></a>     创建一个指向位于文档内部靶位的链接 






格式排版(命令)
  <p>             创建一个新的段落。放在文字的结尾
  <p align=?>         将段落按左、 中、 右对齐
  <br>             空开一行,必须在文字的开头与结尾同时用
  <blockquote></blockquote>  从两边缩进文本
  <dl></dl>          创建一个定义列表
  <dt>             放在每个定义术语词之前
  <dd>             放在每个定义之前
  <ol></ol>          创建一个标有数字的列表
  <li>             放在每个数字列表项之前,并加上一个数字
  <ul></ul>          创建一个标有圆点的列表
  <li>             放在每个圆点列表项之前,并加上一个圆点
  <div align=?>        一个用来排版大块HTML 段落的标签,也用于格式化表 






  二、HTML基本语法


  文件格式<html></html> (文件的开头与结尾)
  主题<title></title> (放在文件的开头)
  文头区段<head></head> (描述文件的信息)
  内文区段<body></body> (放此文件的内容)
  标题<h?></h> (?=1~6,改变标题字的大小)
  标题对齐<h align=right,left,center></h>
  字加大<big></big>
  字变小<small></small>
  粗体字<b></b>
  斜体字<i></i>
  底线字<u></u>
  上标字<sup></sup>
  下标字<sub></sub>
  居中<center></center>
  居左<left> </left>
  居右<right> </right>
  基本字体大小<basefont size> (取值范围从1到7,默认值为3)
  改变字体大小<font size=?></font>(?=1~7)
  字体颜色<font color=#rrggbb></font> (RGB色码)
  指定字型<font face=?></font> (?=宋体,楷体等)
  网址链结<a href="URL"></a>
  设定锚点<a name="?"></a> (?以容易记为原则)
  链结到锚点<a href="#?"></a> (同一份文件)
  <a href="URL#?"></A> (锚点不同文件)
  显示图形<img original="URL"></a>
  图形位置<img original="URL" align=top,bottom,middle,left,right>(分别为上、下、中、左、右的位置)
  图形取代文字<img original="图片地址"alt=1> (无法显示图形时用,可以设置边框大小)
  图形尺寸<img original="图片地址" width=宽 height=高> (?以像素为单位)
  连结图形边线<img original="图片地址"border=?> (?以像素为单位)
  图形四周留白<img original="图片地址"hspace=? vspace=?>(?以像素为单位)
  段落<p></p>
  断行<br></br>
  横线<hr>
  横线厚度<hr size=?> (?以像素为单位)
  横线长度<hr width=?> (?以像素为单位)
  横线长度<hr width=?%> (?与页宽相比较)
  实横线<hr noshade> (无立体效果)
  背景图案<body background=图片地址> (图形文件格式为gif和jpg)
  背景颜色<body bgcolor=#rrggbb> (RGB色码)
  背景文字颜色<body text=#rrggbb> (RGB色码)
  未链结点颜色<body link=#rrggbb> (RGB色码)
  已链结点颜色<body vlink=#rrggbb> (RGB色码)

  正在链结点颜色<body alink=#rrggbb> (RGB色码) 


  基本语法总结如下
  1)贴图:<img original=“图片地址“> 
  2)加入连接:<a href=“所要连接的相关地址“>写上你想写的字</a>
  3)在新窗口打开连接:<a href=“相关地址“ target=“_blank“>写上要写的字</a>
  4)移动字体(走马灯):<marquee>写上你想写的字</marquee>
  5)字体加粗:<b>写上你想写的字</b>
  6)字体斜体:<I>写上你想写的字</I>
  7)字体下划线: <U>写上你想写的字</U>
  8)字体删除线: <s>写上你想写的字</s>
  9)字体加大: <BIG>写上你想写的字</BIG>
  10)字体控制大小:<H1>写上你想写的字</H1> (其中字体大小可从H1-H5,H1最大,H5最小)
  11)更改字体颜色:<font color=“#value“>写上你想写的字</font>(其中value值在000000与FFFFFF(16位进制)之间
  12)消除连接的下划线:<a href=“相关地址“ style=“text-decoration:none“>写上你想写的字</a>
  13)贴音乐:<embed original=“音乐地址“ width=“宽度“ height=“高度“ autostart=false> 
  14)贴flash: <embed original=“flash地址“ width=“宽度“ height=“高度“>
  15)贴影视文件:<img dynoriginal=“文件地址“ width=“宽度“ height=“高度“ start=mouseover> 
  16)换行:<br>
  17)段落:<p>段落</p>
  18)原始文字样式:<pre>正文</pre>
  19)换帖子背景:<body background=“背景图片地址“>
  20)固定帖子背景不随滚动条滚动:<body background=“背景图片地址“ body bgproperties=FIXED>
  21)定制帖子背景颜色:<body bgcolor=“#value“>(value值见10)
  22)帖子背景音乐:<bgsound=“背景音乐地址“ loop=infinite>
  23)贴网页:<iframe original=“相关地址“ width=“宽度“ height=“高度“></iframe> 
  24)字体上标:一个字<sup>写上你想写的字</sup>

  25)字体下标:一个字<sub>写上你想写的字</sub> 

特效代码


  1、公告栏里滚动的字幕,可以将以下代码放入布告中
  <marquee direction=left>文字内容</marquee>


  公告栏里滚动的图片
  <marquee direction=left><img original="图片地址"></marquee>
  其中,引号中的url可以自己选择


  2、自己定义字体的大小和颜色
  <font size=7 color=red>文字内容</font>
  其中,7可以改为1到7中的任意数字,red可以改为任何一种颜色


  3、在叶面上加flash
  <iframe 
  original=FLASH地址 frameborder=0 width=650 height=400 ;></iframe>
  其中,地址可以自己修改 
       代码如下<MARQUEE>滚动文字</MARQUEE> 


  <marquee style="WIDTH: 388px; HEIGHT: 200px" scrollamount="2" direction="up" >
  <div align="left" ><br />
  </div >
  <center ><font face="黑体" color="#008000" size="4" ></font ></center >
  <div align="left" ><br />
  </div >
  <center >
  <p ><font color="#ff6600" size="4" >滚动文字</font ></p >
  <p ><font color="#ff4500" size="4" >滚动文字</font ></p >
  <p ><font color="#ff3300" size="4" >滚动文字</font ><br />
  <br />
  </p >
  </marquee >




  marquee 参数: 
  BGColor:滚动文本框的背景颜色。 
  Direction:滚动方向设置,可选择Left、Right、up和down。 
  scrolldelay:每轮滚动之间的延迟时间,越大越慢。 
  scrollamount:一次滚动总的时间量,数字越小滚动越慢。 
  Behaviour:滚动的方式设置,三种取值:Scroll(循环滚动) lide(单次滚动)、Alternate(来回滚动)。 
  Align:文字的对齐方式设置。可选择Middle(居中)、Bottom(居下)还是Top(居上)。 
  Width:滚动文本框的宽度,输入一个数值后从后面的单选框选择in Pixels(按像素)或是in Percent(按百分比)。 
  Height:滚动文本框的高度,输入一个数值后从后面的单选框选择in Pixels(按像素)或是in Percent(按百分比)。 
  loop:滚动次数。默认为infinite 
  hspace、vspace:前后、上下的空行。

  • 2
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值