三列横向并排列的几种代码示例

2022-07-15 80酷酷网 80kuku.com

第一种方法代码:

以下是HTML网页特效代码，点击运行按钮可查看效果：以下是程序代码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh"><head profile="http://www.w3.org/2000/08/w3c-synd/#"><meta http-equiv="content-language" content="zh-cn" /><meta http-equiv="content-type" content="text/html;charset=gb2312" /><title>blueidea</title><style type="text/css">/*<![CDATA[*/div { float:left; margin:1px; width:200px; height:200px; background:orange }/*]]>*/</style></head><body><div></div><div></div><div></div></body></html></font><a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站，js.alixixi.com</a>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

第二种方法代码:

以下是HTML网页特效代码，点击运行按钮可查看效果：以下是程序代码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh"><head profile="http://www.w3.org/2000/08/w3c-synd/#"><meta http-equiv="content-language" content="zh-cn" /><meta http-equiv="content-type" content="text/html;charset=gb2312" /><title>blueidea</title><style type="text/css">/*<![CDATA[*/div {position:absolute;top:50%;left:50%;margin:-100px 0 0 -300px;}/*]]>*/</style></head><body><div 0 0 -100px;">2</div><div 0 0 100px;">3</div></body></html></font><a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站，js.alixixi.com</a>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

第三种方法代码:

以下是HTML网页特效代码，点击运行按钮可查看效果：以下是程序代码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh"><head profile="http://www.w3.org/2000/08/w3c-synd/#"><meta http-equiv="content-language" content="zh-cn" /><meta http-equiv="content-type" content="text/html;charset=gb2312" /><title>blueidea</title><style type="text/css">/*<![CDATA[*/span { margin:1px; display:-moz-inline-box; display:inline-block; width:300px; height:200px; background:orange; }/*]]>*/</style></head><body><span></span><span></span><span></span></body></html></font><a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站，js.alixixi.com</a>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]