(全)常用HTML代码速查表 - 松风竹韵的日志 - 网易博客

来源:百度文库 编辑:神马文学网 时间:2024/04/28 12:58:21
常用HTML代码速查表 2009-06-30 20:24
分类:关于HTML
字号:大大 中中  小
引用
夜雨 的常用HTML代码速查表
常用HTML代码速查表
标记或参数 定 义
连结标记
地址标记(斜体效果)
连结区域标记(设定各连结区域)
alink 点击连结时的样式。例:alink="#FF0000"
align 水平方向摆放位置。例:align="center"
alternate 来回走动,例:behavior=alternate
alt 在连结中插入文字说明。例:alt="绿叶园"
字体加粗标记(产生字体加粗的效果)
正文标记(设计文件格式及内文所在)

换行标记(令文字、图片等显示在下一行)
字体加大标记(令字体稍为加大)
闪烁文字标记(令文字产生闪烁效果)
背景声音标记(于背景播放声音或音乐)
连结基准标记(可将网页中所有的相对路径转换成绝对路径)
基准字形标记(设定所有字的字形、大小、颜色)
引述文字区块、令文字在表格的上下左右留有一定的空间
background 背景墙纸。例:background=01.JPG
bgcolor 背景颜色。例:bgcolor="#ff0000"
bgproperties 固定背景墙纸。例:bgproperties="fixed"
border 边框。例:border=10
bordercolor 边框颜色。例:bordercolor="#000080"
bordercolorlight 边框向光部分的颜色。例:bordercolorlight="#000000"
bordercolordark 边框背光部分的颜色。例:bordercolordark="#ffffff"
bottom 置于底端。例:valign="bottom"
behavior 卷动方式。例:behavior=alternate
_blank 表示连结的目标地址在新建窗口中打开。例:target=_blank
居中标记(令文字、图片、表格等显示于中间)
表格标题(做成一打通列以填入表格标题)
程式码(字体稍为加宽如)
引述(斜体效果)
colspan 该单元格向右打通。例:colspan="5"
color 颜色。例:color="#00FF00"
cellspacing 单元格间距。例:cellspacing="5"
cellpadding 单元格衬距。例:cellpadding="10"
区域标记
述语定义标记(斜体效果)
目录清单标记(清单项目将以圆点排列,如

    定义清单标记(清单分两层出现)
    定义条目标记(标示该项定义的标题)
    定义内容标记(标示定义内容)
    direction 方向。例:direction=up
    强调标记(字体出现斜体效果)
    多媒体标记

    选单清单标记(清单项目将以圆点排列,如

      开头定义标记
      影像地图名称标记(设定影像地图名称)
      走动标记
      middle 居中。例:align="middle"
      marginwidth 框架左右边缘与框架内的文件保留的空间。例:marginwidth=0
      marginhight 框架上下边缘与框架内的文件保留的空间。例:marginheight=0
      不换行标记(强制文字不自动换行)
      不支持框架标记(当旧式浏览器不支援框架时显示提示)<br>name 参考点(锚点)。例:<a ></a><br>no 否。例:scrolling=no<br>noshade 平面显示。例:<hr noshade><br>noresize 锁住框架窗口的大小<br><OL> 顺序清单标记(清单项目将以数字、字母顺序排列)<br><P> 段落标记(为字、画、表格等之间留一空白行)<br><PRE> 预设格式标记(令文件按照原始码的排列方式显示)<br>_parent 父窗口(连结的目标网页在本窗口中打开)。例:target=_parent<br>playbutton 在媒体播放面板中显示播放按钮<br>pausecutton 在媒体播放面板中显示暂停按钮<br><STRONG> 加重语气标记(产生字体加粗 Bold 的效果)<br><SMALL> 字体缩细标记(令字体稍为缩细)<br><STRIKE> 划删除线标记(为字体加一删除线)<br><SAMP> 范例标记(字体稍为加宽如)<br><SUB> 下标字标记<br><SUP> 上标字标记<br><STYLE> 样式表标记<br><SPAN> 自订标记(独立使用或与样式表同用)<br><SELECT> 选择标记(建立 pop-up 走动清单)<br><SCRIPT> 引用脚本标记<br>size 大小。例:size="7"<br>src 来源。例:src="logo.gif"<br>_self 相同窗口(在相同的框架中显示连结的内容)。例:target="_self"><br>starttime 开始播放的时间。例:starttime="00:10"<br>smallconsole 显示较小的面板。例:controls="smallconsole"<br>stopbutton 显示停止按钮。例:controls="stopbutton"<br>scrolling 滚动条。例:scrolling=no<br>scroll 走动。例:behavior="scroll"<br>scrollamount 走动的速度。例:scrollAmount=25<br>scrolldelay 走动的停顿时间。例:scrolldelay=1000<br>slide 逐格走动(幻灯式)。例:behavior="slide"<br><TITLE> 网页文件标题标记<br><TABLE> 表格标记<br><TR> 表格的行<br><TD> 表格的列<br><TH> 表格标头(相等于<TD>,但其内之字体会变粗)<br><TT> 打字字体(Courier字体,字母宽度相同)<br><TEXTAREA> 文字区块(提供文字方盒以输入较大量文字)<br>topmargin 网页的上边距。例:topmargin=10<br>top 上方。例:valign="top"<br>text 整个网页的文字颜色。例:text=#CE0063<br>target 超级连接打开窗口模式。例:target=_blank<br>_top 将连结的网页显示在没有框架的窗口中。例:target=_top<br>type 样式。例:type="text/css"<br>true 是。例:loop="true"<br><U> 下划线标记(给文本加上底线)<br><UL> 无序清单(清单项目将以圆点排列)<br><VAR> 变数标记(斜体效果)<br>valign 摆放位置(垂直方向)。例:valign="top"<br>vlink 被访问后超链接文字的样式。例:vlink="#0000FF"<br>vspace 图片上下的空间。例:vspace=20<br>volume 音量(设定音量大小)。例:volume="100"<br>volumelever 显示音量调整钮。例:controls="volumelever"<br><WBR> 建议换行标记(预设换行部位)<br>width 宽度、长度。例: width="540"<br>在搏客中比较常用的代码<br>一、美化文字的代码:<br>1.文字间换行:<br>文字内容<br>文字内容<br>2.一个段落:<br><p>文字内容</p><br>3.字体加粗:<br><b>文字内容</b><br>4.字体加大:<br><big>文字内容</big><br>5.文字标题:<br>// 从一号标题H1到六号标题H6,逐渐减小<br><h2>文字内容</h2><br>6.斜体字:<br><i>文字内容</i><br>7.在字前加圆点:<br><li>文字内容</li><br>8.字体下划线:<br><u>文字内容</u><br>9.字体删除线:<br><s>文字内容</s><br>10.更改字体颜色:<br>// value值在000000与ffffff(16位进制)之间<br><font color="#value">文字内容</font><br>11.加入连接:<br>// target="_blank" 在新窗口打开连接<br><a href="所要连接的相关地址" target="_blank">显示在页面上的文字</a><br>12.消除连接的下划线:<br><a href="相关地址" style="text-decoration:none">文字内容</a><br>13.滚动文字效果:<br>// marquee有四个方向参数,如图1<br><marquee direction="up">文字内容</marquee><br><img style='max-width:300px;' id="img0" src="http://image4.360doc.cn/DownloadImg/2009/7/4/82777_4131517_1.jpg" /><br><br>图1<br>14.原始文字样式:<br>// 可以显示半角的空格等原文内容<br><pre>  正文</pre><br>二、在博客中嵌入其他元素<br>1.在博客中贴图:<br>// width是图片的宽度,height是高度<br><img src="图片地址"; width="120"; height="90"; alt="鼠标移动到图片上显示的字";><br>2.在博客中贴Flash:<br>// width,height可以是指定的高度,也可以不设置,可以是100%<br><embed src="flash地址" width="100%" height="100%"><br>3.在博客中贴音乐:<br><embed src="音乐地址" width="宽度" height="高度" autostart=false><br>4.博客中贴食品:<br><img dynsrc="文件地址" width="宽度" height="高度" start=mouseover><br>5.设置日志背景:<br><body background="背景图片地址"><br>6.固定日志背景不随滚动条滚动:<br><body background="背景图片地址" body bgproperties=fixed><br>7.定制日志背景颜色:<br><body bgcolor="#value"><br>8.定制日志背景音乐:<br><bgsound="背景音乐地址" loop=infinite><br>博客基本代码大全[新学员]<br>一,基本代码<br>字体控制<br>◆字体加粗:<b>写上你想写的字</b><br>◆字体斜体:<i>写上你想写的字</i><br>◆字体下划线: <u>写上你想写的字</u><br>◆字体删除线: <s>写上你想写的字</s><br>◆字体加大: <big>写上你想写的字</big><br>◆换行:<br><br>◆空格:&nbsp;<br>◆段落:<p>段落</p><br>◆原始文字样式:<pre>正文</pre><br>◆字体控制大小:<h1>写上你想写的字</h1> (其中字体大小可从h1-h5,h1最大,h5最小)<br>◆更改字体颜色:<font color="#value">写上你想写的字</font>(其中value值在000000与ffffff(16位进制)之间<br>◆移动字体(走马灯):<marquee>写上你想写的字</marquee><br>对齐方式<br>◆左对齐: LEFT<br>◆中对齐: CENTER<br>◆右对齐: RIGHT<br>◆段落水平对齐:<ALIGN=”相关参数">。其常见的设定值有三个:置左<ALIGN="LEFT">、置中<ALIGN="CENTER">、置右<ALIGN="RIGHT"><br>◆缩排:<BLOCKQUOTE> 要缩排的文字 </BLOCKQUOTE>。一组缩排一个单位,二组缩排两个单位,以此类推。<br>文字控制代码<br>◆文字向上滚动的代码:<br><MARQUEE scrollAmount=3 direction=up height=50><br><CENTER><FONT face=黑体 color=blue size=5><B>文字一<BR><BR>文字二<BR><BR>文字三< BR><BR>文字四<BR><BR>文字五</B></FONT> <BR><BR><br></CENTER></MARQUEE><br><MARQUEE >里面的参数修改一下,效果将不一样,这里仅提醒一下direction参数,可以改为向下(down)、向左(left)和向右(right)。<br>图片控制代码<br>◆贴图:<img src="图片地址"><br>◆换帖子背景:<body background="背景图片地址"><br>◆定制帖子背景颜色:<body bgcolor="#value">(value值)<br>◆固定帖子背景不随滚动条滚动:<body background="背景图片地址" body bgproperties=fixed><br>◆加背景<TABLE style="WIDTH: 706px; HEIGHT: 164px" borderColor=#00fa9a height=164 width=706 align=center background=背景图片 border=3><br>◆图片滚动代码 (从下往上滚动)<br><marquee align=center direction=up scrollamount=1 scrolldelay=3 valign=middle behavior="scroll"><br><img border="0" src=" http://要滚动的图片地址1"><br><img border="0" src=" http://要滚动的图片地址2"><br></marquee><br>◆移动图片的代码:<br><marquee><img src="图片地址";><img src="图片地址";><img src="图片地址";></marquee><br>把里面的图片地址换成自己网上找的就行。想多放几个图片就按照格式在中间重复插入:<img src="图片地址";>&<60;<br>颜色方面<br>◆颜色属性:<HR COLOR="颜色代码或颜色名称">。<br>◆宽窄属性:<HR WIDTH="宽度">,单位为px,宽度也可用百分比来作设定,如50%即为宽度占屏幕的50%。<br>◆厚度属性:<HR SIZE="厚度">。<br>◆位置属性::<HR ALIGN="水平位置设定值">,其设定值有三个,置左"LEFT"、置中"CENTER"、置右"RIGHT"。<br>◆阴影属性:<HR NOSHADE>,无设定值,只要将NOSHADE加入即可,通常会配合颜色设定,效果较佳。<br>链接代码<br>◆加入连接:<a href="链接地址">写上你的字</a><br>◆新窗口打开连接:<a href="链接地址" target="_blank">写上你的字</a><br>◆消除连接的下划线:<a href="相关地址" style="text-decoration:none">写上你想写的字</a><br>◆贴带连接的字:<a href="所要连接的相关地址">写上你想写的字</a><br>FLASH<br>◆贴flash: <embed src="flash地址" width="宽度" height="高度"><br>◆首页FLASH: 找到FLASH地址 后点编辑-排版-模块-添加自定义HTML- 点 Flash 复制进去就行了 这个很简单<br>◆日志里的FLASH: 好多朋友多说为什么我把代码粘贴到日志里但就是显示不出FLASH呢? 我现在就告诉你 因为你忘记点下面那个 <代码> 了 必须先点一下代码后再复制上去.<br>◆日志里FLASH的代码是:<br><EMBED pluginspage=http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash src= FLASH地址 width=800 height=600 type=application/x-shockwave-flash quality="high"><br>音乐<br>◆贴音乐:<embed src="音乐地址" width="宽度" height="高度" autostart=false><br>◆帖子背景音乐:<bgsound="背景音乐地址" loop=infinite><br>◆贴影视文件:<img dynsrc="文件地址" width="宽度" height="高度" start=mouseover><br>◆贴flash: <embed src="flash地址" width="宽度" height="高度"><br>其他<br>◆制作个性名片<br>编辑-排版-模块-添加自定义 HTML <table width="100%"><tr><td style="padding: 2px;"><img style="border: 1px solid rgb(153, 153, 153); width: 140px; height: 140px;"<br>src=头像图片地址></td><td valign="top"><table width="100%"><tr><td><img src="/style/common/gg.gif"></td></tr><tr><td><div style="font-weight: bold;font-size:16px;"><a href="邮箱地址">你的名字</a></div></td></tr><tr><td><div>年龄,星座</div></td></tr><tr><td><div>详细地址</div><br>由于我只用QQ 所以我只会加QQ在线交谈按钮: QQ个人设置-右下角<生成在线状态> 进去填写好资料后生成网页代码然后全复制过来<br>◆滚动条添加<br><DIV style="OVERFLOW-Y: auto; OVERFLOW-X: hidden; WIDTH: 698px; HEIGHT: 125px"><br><P align=left>在这里输入是文字,也可以是链接</P></DIV><br>注:(left)为对齐方式,当前是左对齐<br>◆友情连接<br>编辑-排版-模块-添加自定义HTML 然后把<marquee behavior="scroll" direction=right width="90%" height="100" scrollamount="2" scrolldelay="30" ><a target="cont" href="对方地址"><img src="对方图片" width="100" height="100" border="0"></a></marquee> 复制上去就行了<br>◆贴网页:<iframe src="相关地址" width="宽度" height="高度"></iframe>&<60;<br>◆博客上加新闻链接代码<br><TABLE width=200 align=center><br><DIV g_p_fill?>&nbsp;<EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=http://www.xianguo.com/img/share/widget.swf?wd=200&amp;ht=300&amp;hs=www.xianguo.com&amp;id=14889&amp;tp=2&amp;ps=5&amp;ss=1&amp;ar=1&amp;ct=6&amp;tt=%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20Welcome width="100%" type=application/x-shockwave-flash wmode="transparent" quality="high" autostart="0" allowNetworking="internal" allowScriptAccess="never"></EMBED></DIV><br><TBODY></TBODY></TABLE></div> <div class="list-group"> <a href="/article/1715755" class="list-group-item">(全)常用HTML代码速查表 - 松风竹韵的日志 - 网易博客</a> <a href="/article/1153637" class="list-group-item">常用HTML代码速查表 - 松风竹韵的日志 - 网易博客</a> <a href="/article/1230915" class="list-group-item">常用HTML代码速查表 - 松风竹韵的日志 - 网易博客</a> <a href="/article/1300161" class="list-group-item">常用HTML代码速查表 - 哥们干杯!的日志 - 网易博客</a> <a href="/article/2099515" class="list-group-item">HTML语言宝鉴 - 松风竹韵的日志 - 网易博客</a> <a href="/article/2965943" class="list-group-item">网易博客教程--博客常用HTML语法全攻略) - 依墙待红杏的日志 - 网易博客</a> <a href="/article/1296124" class="list-group-item">引用 常用HTML代码速查表 - 成靖的日志 - 网易博客</a> <a href="/article/1346571" class="list-group-item">引用 常用HTML代码速查表 2- 成靖的日志 - 网易博客</a> <a href="/article/2133440" class="list-group-item">各种代码的含义图片写字 - 松风竹韵的日志 - 网易博客</a> <a href="/article/690610" class="list-group-item">人民币的履历表 - 松风竹韵的日志 - 网易博客</a> <a href="/article/741696" class="list-group-item">人民币的履历表 - 松风竹韵的日志 - 网易博客</a> <a href="/article/791773" class="list-group-item">【原创】周年絮语 - 松风竹韵的日志 - 网易博客</a> <a href="/article/1250610" class="list-group-item">国粹景泰蓝鉴赏 - 松风竹韵的日志 - 网易博客</a> <a href="/article/2614821" class="list-group-item">引用 感悟篇 - 松风竹韵的日志 - 网易博客</a> <a href="/article/915900" class="list-group-item">博客常用HTML语法全攻略 - 香儿的日志 - 网易博客</a> <a href="/article/2985301" class="list-group-item">博客常用HTML语法全攻略 - 香儿的日志 - 网易博客</a> <a href="/article/2693815" class="list-group-item">(原创)HTML代码总汇 - 平儿的日志 - 网易博客</a> <a href="/article/1099178" class="list-group-item">网易博客HTML代码</a> <a href="/article/1181663" class="list-group-item">松风竹韵 - 松风竹韵 - 网易博客</a> <a href="/article/894021" class="list-group-item">毛泽东诗词全集欣赏 - 松风竹韵的日志 - 网易博客</a> <a href="/article/932145" class="list-group-item">FLASH歌曲选粹第一辑 - 松风竹韵的日志 - 网易博客</a> <a href="/article/977262" class="list-group-item">风景名胜旅游地对联集萃 - 松风竹韵的日志 - 网易博客</a> <a href="/article/2614780" class="list-group-item">中国传世山水名画全集 - 松风竹韵的日志 - 网易博客</a> <a href="/article/2241606" class="list-group-item">常用HTML代码速查表</a> </div> </div> </div> </div> </div> </div> <footer id="footer" class="footer hidden-print"> <div class="container"> <div class="panel panel-default"> <div class="panel-heading">相关问题</div> <div class="panel-body"> <a class="btn btn-default" href="/article/2115706" title="探访神秘琉球古国:处处渗透中华风(网友贴图)">探访神秘琉球古国:处处渗透中华风(网友贴图)</a> <a class="btn btn-default" href="/article/2115707" title="男性必知的着装常识(男人珍藏篇) - Qzone日志">男性必知的着装常识(男人珍藏篇) - Qzone日志</a> <a class="btn btn-default" href="/article/2115708" title="多活22年的5个简单方法(组图)">多活22年的5个简单方法(组图)</a> <a class="btn btn-default" href="/article/2115709" title="慈禧太后的珍宝大观!(多图2">慈禧太后的珍宝大观!(多图2</a> <a class="btn btn-default" href="/article/2115710" title="【妙龄女被禽兽男友身体上上下下刻满字">【妙龄女被禽兽男友身体上上下下刻满字</a> <a class="btn btn-default" href="/article/2115711" title="一个短线高手的投资历程22">一个短线高手的投资历程22</a> <a class="btn btn-default" href="/article/2115712" title="健康指南:养生根本为长寿 4种菜吃出长生不老">健康指南:养生根本为长寿 4种菜吃出长生不老</a> <a class="btn btn-default" href="/article/2115713" title="小心好友离婚会传染给你">小心好友离婚会传染给你</a> <a class="btn btn-default" href="/article/2115714" title="媒体称基层权力监督缺位 村官腐败不逊于高官_">媒体称基层权力监督缺位 村官腐败不逊于高官_</a> <a class="btn btn-default" href="/article/2115715" title="极品欣赏 翡翠集萃!【组图】">极品欣赏 翡翠集萃!【组图】</a> <a class="btn btn-default" href="/article/2115716" title="【美爆了!】5分钟打造早秋百变发型">【美爆了!】5分钟打造早秋百变发型</a> <a class="btn btn-default" href="/article/2115717" title="[转载]致CCTV柴静:“狼来了”和方舟子的“被袭击”-肖传国的博客-科学网">[转载]致CCTV柴静:“狼来了”和方舟子的“被袭击”-肖传国的博客-科学网</a> <a class="btn btn-default" href="/article/2115718" title="希特勒罕见战时休闲照片首次曝光[组图]">希特勒罕见战时休闲照片首次曝光[组图]</a> <a class="btn btn-default" href="/article/2115719" title="得与失… 多与少…">得与失… 多与少…</a> <a class="btn btn-default" href="/article/2115720" title="国美控制权之争结果揭晓 陈晓胜出">国美控制权之争结果揭晓 陈晓胜出</a> <a class="btn btn-default" href="/article/2115721" title="三九天御寒6种佳肴!">三九天御寒6种佳肴!</a> <a class="btn btn-default" href="/article/2115722" title="装修设计风格(图解)">装修设计风格(图解)</a> <a class="btn btn-default" href="/article/2115723" title="內心交錯">內心交錯</a> <a class="btn btn-default" href="/article/2115724" title="新年祝福贺图">新年祝福贺图</a> <a class="btn btn-default" href="/article/2115725" title="世纪发烧情歌CENTURYlove[flac/cue/115]">世纪发烧情歌CENTURYlove[flac/cue/115]</a> <a class="btn btn-default" href="/article/2115726" title="教你如何查看自己电脑开关机">教你如何查看自己电脑开关机</a> <a class="btn btn-default" href="/article/2115727" title="生活常识(日常的)">生活常识(日常的)</a> <a class="btn btn-default" href="/article/2115728" title="《易经的奥秘——周易解读》 优酷视频">《易经的奥秘——周易解读》 优酷视频</a> <a class="btn btn-default" href="/article/2115729" title="微型课题研究的一般过">微型课题研究的一般过</a> <a class="btn btn-default" href="/article/2115730" title="从通奸到婚外情看都市人的性意识">从通奸到婚外情看都市人的性意识</a> <a class="btn btn-default" href="/article/2115731" title="让女人气血两旺的12个小绝招 - ざ冰火↗ザ的日志 - 网易博客">让女人气血两旺的12个小绝招 - ざ冰火↗ザ的日志 - 网易博客</a> <a class="btn btn-default" href="/article/2115732" title="中方重估邓小平钓岛政策:实际控制是硬道理">中方重估邓小平钓岛政策:实际控制是硬道理</a> <a class="btn btn-default" href="/article/2115733" title="这341句话 这么美 那么伤···">这341句话 这么美 那么伤···</a> <a class="btn btn-default" href="/article/2115734" title="培根是什么,培根怎么作">培根是什么,培根怎么作</a> <a class="btn btn-default" href="/article/2115735" title="【转】 50个好网站,从此上网不再虚度!">【转】 50个好网站,从此上网不再虚度!</a> <a class="btn btn-default" href="/article/2115736" title="致命报复:你勾引我爸爸出轨,我诱惑你老公堕落--小三,呵呵">致命报复:你勾引我爸爸出轨,我诱惑你老公堕落--小三,呵呵</a> </div> </div></div> <div class="copy-right"> <p>神马文学网,客观、专业、权威的知识性互动百科全书。</p></div> </footer> </body> </html>