当前位置:文档之家› HTML基本代码

HTML基本代码

HTML基本代码size粗细 color颜色 width宽度 height高度--------------------------------------------------------------------- <br>换行 <P></P>段落 align左右对齐方式 valign上下对齐方式---------------------------------------------------------------------<hr>水平线段 (size粗细 color颜色水平线的宽度width 水平线的长度用占屏幕宽度的百分比或象素值来表示align 水平线的对齐方式,有left right center三种 noshade 线段无阴影属性,为实心线段)---------------------------------------------------------------------文字<font 属性></font>{(属性:SIZE=取值1-7 face=字体)(粗体<B></B>.斜体<I></I>.加下划线<U></U>.中间线<S></S>字体上一点<sup></sup> 字体下一点<sub></sub>打字机字体<TT></TT>.大型字体<BIG></BIG>.小型字体<SMALL></SMALL>.闪烁效果<blink></blink>.强调<em></em>.特别强调<strong></strong>.引证举例<cite></cite>)(字体:Script . Small Fonts . Roman . Comic Sans MS . Arial . Modern . MS Sans Serif)文字移动<marquee>内容</marquee>方向:<marquee direction=>内容</marquee> (属性:左left右right)方式:<marquee bihavior=>内容</marquee> (属性:一圈一圈绕着scroll走一次slide来回走alternate)速度: <marquee scrollamount=>内容</marquee>延时: <marquee scrolldelay=>内容</marquee>向上: <marquee direction=up scrollamount=3><center><font color=颜色 size=大小 face=字体>内容</font></marquee>向下:<marquee direction=down scrollamount=3><center><font color=颜色 size=大小 face=字体>内容</font></marquee>底色: <marquee bgcolor=颜色>内容</marquee> (属性:width宽度 height高度) --------------------------------------------------------------------- 位置控制<div align=属性></div>(属性=left左对齐缺省值 center 居中right右对齐)--------------------------------------------------------------------- 无序号列表<ul></ul>条目前加<li>序号列表<ol></ol>条目前加<li>(<li type=实圆disc 空圆circle 实方square>定义性列表<dl></dl>(<dt>主要<dd>叙述主要的定义)--------------------------------------------------------------------- 表格的基本结构<table>...</table> 定义表格(属性width= height= border= CELLSPACING=格线间 CELLPADDING=格线内背景色彩bgcolor=)<caption>...</caption> 定义标题(属性top上方.bottom下方)<tr> 定义表行 (横跨colspan=几格.竖跨rowspan=几格背景颜色bgcolor=)<th></th> 定义表头 (属性:背景颜色bgcolor=)<td></td> 定义表元(表格的具体数据.属性align左右对齐方式valign上下对齐方式 top上middle中bottom下baseline基线属性:背景颜色bgcolor=)(背景颜色:Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime, Fuchsia, White, Green, Purple, Silver, Yellow, Aqua)--------------------------------------------------------------------- 超级链接文字连接<a href=资源地址>链接文字</a>图片连接<a href=资源地址><img src=图形文件地址></a>--------------------------------------------------------------------- 图形格式<img src=图形文件地址>(属性:width= heigth=)--------------------------------------------------------------------- 播放音乐/视频<embed src=音乐文件地址>(属性:循环开/关loop=true/false 隐藏控制面板hidden=true/false width= heigth=)背景音乐<bgsound src=音乐文件地址>(属性:循环开/关LOOP=TRUE/FALSE)视频<img src=1 dynsrc=2>(1指图片地址.2指视频地址.总是循环loop=infinite)(注:这个命令可以在没连接到视频时,先显示图片)===================================================================== ul li CSS 样式列表是HTML里一种很有用的显示方式,可以把相关的并列内容整齐地垂直排列,使网页显得整洁专业,并让浏览者有一目了然的感觉。

样式表为列表增加了一些功能,控制列表的样式包括列表样式、图形符号、列表位置三个部分。

1.列表符号列表符号是指显示于每一个列表项目前的符号标识。

基本格式如下:list-style-type:参数参数取值范围:·disc:圆形·circle:空心圆·square:方块·decimal:十进制数字·lower-roman:小写罗马数字·upper-roman:大写罗马数字·lower-alpha:小写希腊字母·upper-alpha:大写希腊字母·none:无符号显示参数中的disc是默认选项。

2.图形符号图形符号指原来列表的项目符号将可以使用图形来代替。

基本格式如下:list-style-image:URLURL是用来代替项目符号的图形文件的地址,可以使用相对地址或绝对地址。

3.列表位置列表位置描述列表在何处显示。

基本格式如下:list-style-position:参数参数取值范围:·inside:在BOX模型内部显示·outside:在BOX模型外部显示这里又出现了一个新的概念:BOX模型。

BOX是指一种容器,包含了应用样式规则的对象,具体介绍将在后文中给出。

使用无序列表:即UL看一个最简单的例子:<ul><li>Item 1</li><li>Item 2</li><li>Item 3</li><li>Item 4</li></ul>这是一个未加修饰的纵向列表1:设置列表的边界#base { border: 1px solid #000; margin: 2em; width: 10em; padding: 5px; } html中这样写,就会呈现一个带边框的无序列表<div id="base"><ul><li>Item 1</li><li>Item 2</li><li>Item 3</li><li>Item 4</li></ul></div>2:设定列表的图像可以设定列表的样式为左边带一个图像,样式如下:ul { list-style-type: disc; list-style-image: url(bullet.gif); list-style-position: inside; }disc表示实心的圆,list-style-image表示列表用到的小图像,如果这个图像的url不正确时,disc 才会起作用,inside表示列表是在区块内部的。

3:如何在段落中使用列表样式如下:#inline-list {border: 1px solid #000; margin: 2em; width: 80%; padding: 5px; font-family: Verdana, sans-serif;}#inline-list p { display: inline; }#inline-list ul, #inline-list li {display: inline; margin: 0; padding: 0; color: #339; font-weight: bold; }4:水平导航#h-contain {padding: 5px; border: 1px solid #000; margin-bottom: 25px;}#pipe ul {margin-left: 0; padding-left: 0; display: inline;}#pipe ul li {margin-left: 0; padding: 3px 15px; border-left: 1px solid #000; list-style: none; display: inline;}#pipe ul li.first {margin-left: 0; border-left: none; list-style: none; display: inline; }#h-contain定一个一个边界为1的区块,水平导航用的也是inline方式,li.first定义第一个列表元素没有左边那个象素为1的border。

相关主题