网页资讯视频图片知道文库贴吧地图采购
进入贴吧全吧搜索
html5吧 关注：156,452贴子：462,649

html5·css·php·js简单代码

http://www.php100.com/index.html
这是关于php的网站，里面的入门教程很全


这是一个图片左右滚动的代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk"/>
<title>123</title>
<script language="javascript" type="text/javascript" src="js/jquery.js"></script>
<script>
$(document).ready(function(){
var totalLiNum=$(*#slide ul*).children(*li*).length;
var trueWidth=totalLiNum*1010;
for(var i=1;i<=totalLiNum;i++){
$(*.icon*).append(*<li index="*+ i +*"><img src="images/s_off.png"/></li>*);
}
$toLeft=function(){
var currentLeft=parseInt($(*#slide ul*).css(*left*).replace(*px*,**));
currentLeft=currentLeft-1010;
$(*#errorinfo*).text(currentLeft);
if((Math.abs(currentLeft))>=(trueWidth-1000)){
$(*#slide ul*).animate({left:0},1000);
}else{
$(*#slide ul*).animate({left:currentLeft},1000);
}
}
$(".toleft").click($toLeft);
$toRight=function(){
var currentLeft=parseInt($(*#slide ul*).css(*left*).replace(*px*,**));
currentLeft=currentLeft+1010;
$(*#errorinfo*).text(currentLeft +"++++"+trueWidth);
if(Math.abs(currentLeft)>=(trueWidth-1000)){
$(*#slide ul*).animate({left:currentLeft},1000);
}else{
$(*#slide ul*).animate({left:0},1000);
}
}
$(".toright").click($toRight);
$selectPic=function(){
var toLeft=$(this).attr(*index*)*1010-1010;
toLeft=toLeft*(-1);
$(*#slide ul*).animate({left:(toLeft+"px")},1000);
$(this).parent().find(*img*).attr(*src*,*images/s_off.png*);
$(this).find(*img*).attr(*src*,*images/s_on.png*);
}
$(".icon li").click($selectPic);
});
</script>
<style>
.warp{width:1000px;margin:0 auto;border: 1px solid #ccc;}
#slide{width:1000px;border:2px solid #ccc;margin:0 auto;overflow:hidden;}
#slide ul{list-style:none;width:9000px;position:relative;left:0px;margin:0;padding:0;}
#slide ul li{float:left;}
#slide ul li img{margin:30px;width:1000px;}
/*按钮*/
.btn-action{ position:relative;width:35px;height:50px;top: -130px; cursor: pointer;opacity:0.5;}
.btn-action:hover{opacity:1; }
.btn-action span{ text-indent: -99999px;display: block;}
.toleft{left:0; background:url(images/left.png);float: left;}
.toright{right:0;background:url(images/right.png);float: right;}
ul.icon{list-style:none;float:left;display:block;}
ul.icon li {width:32px;float:left;}
</style>
<script>
</script>
</head>
<body>
<textarea id="errorinfo">
</textarea>
<div class="warp">
<div id="slide">
<ul class="content">
<li index="1"><img src="images/s01.jpg"/></li>
<li index="2"><img src="images/s02.jpg"/></li>
<li index="3"><img src="images/s03.jpg"/></li>
</ul>
<div class="toleft btn-action"><span>左移</span></div>
<div class="toright btn-action"><span>右移</span></div>
</div>
<ul class="icon">
</ul>
</div>
</body>
</html>


2025-12-30 11:51:31
广告
不感兴趣
开通SVIP免广告
这是一个简单的信封代码
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Subject</title>
<style>
.warp{margin:0 auto;width:1000px;}
.frame{width:800px;border:1px solid #ccc;}
.con{width:640px;height:150px;margin:30px 0 30px 80px;background:url(brackground.png) repeat;}
.con span{font-size:25px;}
.foot{width:800px;height:120px;border:1px solid #ccc;}
.pho{float:left;margin:20px 20px;width:100px;height:80px;border:1px solid #ccc;}
.tit1{float:left;width:300px;position:relative;left:50px;top:30px;}
.tit2{float:left;width:300px;position:relative;left:50px;top:30px;}
.tit2 span{float:right;}
.tit3{float:left;width:200px;position:relative;left:50px;top:30px;}
.tit4{float:left;width:200px;position:relative;left:50px;top:30px;}
.tit5{float:left;width:200px;position:relative;left:50px;top:30px;}
.tit5 span{float:right;}
.tit6{float:left;width:200px;position:relative;left:50px;top:30px;}
.tit7{float:left;width:200px;position:relative;left:50px;top:30px;}
</style>
</head>
<body>
<div class="warp">
<div class="frame">
<div class="con">
<span>************************************************
************************************************
************************************************
************************************************
************************************************
</span>
</div>
</div>
<div class="foot">
<div class="pho">
</div>
<div class="tit1"><span><b>********</b></span></div>
<div class="tit2"><span>********</span></div>
<div class="tit3"><span>*****</span></div>
<div class="tit4"><span>*****</span></div>
<div class="tit5"><span>*****</span></div>
<div class="tit6"><span>*****</span></div>
<div class="tit7"><span>*****</span></div>
</div>
</div>
</div>
</body>
</html>


基础
标签 描述
<!DOCTYPE> 定义文档类型。
<html> 定义 HTML 文档。
<title> 定义文档的标题。
<body> 定义文档的主体。
<h1> to <h6> 定义 HTML 标题。
<p> 定义段落。
<br> 定义简单的折行。
<hr> 定义水平线。
<!--...--> 定义注释。


格式
标签 描述
<acronym> 定义只取首字母的缩写。
<abbr> 定义缩写。
<address> 定义文档作者或拥有者的联系信息。
<b> 定义粗体文本。
<bdi> 定义文本的文本方向，使其脱离其周围文本的方向设置。
<bdo> 定义文字方向。
<big> 定义大号文本。
<blockquote> 定义长的引用。
<center> 不赞成使用。定义居中文本。
<cite> 定义引用(citation)。
<code> 定义计算机代码文本。
<del> 定义被删除文本。
<dfn> 定义定义项目。
<em> 定义强调文本。
<font> 不赞成使用。定义文本的字体、尺寸和颜色
<i> 定义斜体文本。
<ins> 定义被插入文本。
<kbd> 定义键盘文本。
<mark> 定义有记号的文本。
<meter> 定义预定义范围内的度量。
<pre> 定义预格式文本。
<progress> 定义任何类型的任务的进度。
<q> 定义短的引用。
<rp> 定义若浏览器不支持 ruby 元素显示的内容。
<rt> 定义 ruby 注释的解释。
<ruby> 定义 ruby 注释。
<s> 不赞成使用。定义加删除线的文本。
<samp> 定义计算机代码样本。
<small> 定义小号文本。
<strike> 不赞成使用。定义加删除线文本。
<strong> 定义语气更为强烈的强调文本。
<sup> 定义上标文本。
<sub> 定义下标文本。
<time> 定义日期/时间。
<tt> 定义打字机文本。
<u> 不赞成使用。定义下划线文本。
<var> 定义文本的变量部分。
<wbr> 定义视频。


定义视频。
表单
标签 描述
<form> 定义供用户输入的 HTML 表单。
<input> 定义输入控件。
<textarea> 定义多行的文本输入控件。
<button> 定义按钮。
<select> 定义选择列表（下拉列表）。
<optgroup> 定义选择列表中相关选项的组合。
<option> 定义选择列表中的选项。
<label> 定义 input 元素的标注。
<fieldset> 定义围绕表单中元素的边框。
<legend> 定义 fieldset 元素的标题。
<isindex> 不赞成使用。定义与文档相关的可搜索索引。
<datalist> 定义下拉列表。
<keygen> 定义生成密钥。
<output> 定义输出的一些类型。


框架
标签 描述
<frame> 定义框架集的窗口或框架。
<frameset> 定义框架集。
<noframes> 定义针对不支持框架的用户的替代内容。
<iframe> 定义内联框架。


定义内联框架。
图像
标签 描述
<img> 定义图像。
<map> 定义图像映射。
<area> 定义图像地图内部的区域。
<canvas> 定义图形。
<figcaption> 定义 figure 元素的标题。
<figure> 定义媒介内容的分组，以及它们的标题。


2025-12-30 11:45:31
广告
不感兴趣
开通SVIP免广告
音频/视频
标签 描述
<audio> 定义声音内容。
<source> 定义媒介源。
<track> 定义用在媒体播放器中的文本轨道。
<video> 定义视频。


链接
标签 描述
<a> 定义锚。
<link> 定义文档与外部资源的关系。
<nav> 定义导航链接。


列表
标签 描述
<ul> 定义无序列表。
<ol> 定义有序列表。
<li> 定义列表的项目。
<dir> 不赞成使用。定义目录列表。
<dl> 定义定义列表。
<dt> 定义定义列表中的项目。
<dd> 定义定义列表中项目的描述。
<menu> 定义命令的菜单/列表。
<menuitem> 定义用户可以从弹出菜单调用的命令/菜单项目。
<command> 定义命令按钮。


表格
标签 描述
<table> 定义表格
<caption> 定义表格标题。
<th> 定义表格中的表头单元格。
<tr> 定义表格中的行。
<td> 定义表格中的单元。
<thead> 定义表格中的表头内容。
<tbody> 定义表格中的主体内容。
<tfoot> 定义表格中的表注内容（脚注）。
<col> 定义表格中一个或多个列的属性值。
<colgroup> 定义表格中供格式化的列组。


样式/节
标签 描述
<style> 定义文档的样式信息。
<div> 定义文档中的节。
<span> 定义文档中的节。
<header> 定义 section 或 page 的页眉。
<footer> 定义 section 或 page 的页脚。
<section> 定义 section。
<article> 定义文章。
<aside> 定义页面内容之外的内容。
<details> 定义元素的细节。
<dialog> 定义对话框或窗口。
<summary> 为 <details> 元素定义可见的标题。


元信息
标签 描述
<head> 定义关于文档的信息。
<meta> 定义关于 HTML 文档的元信息。
<base> 定义页面中所有链接的默认地址或默认目标。
<basefont> 不赞成使用。定义页面中文本的默认字体、颜色或尺寸。


2025-12-30 11:39:31
广告
不感兴趣
开通SVIP免广告
编程
标签 描述
<script> 定义客户端脚本。
<noscript> 定义针对不支持客户端脚本的用户的替代内容。
<applet> 不赞成使用。定义嵌入的 applet。
<embed> 为外部应用程序（非 HTML）定义容器。
<object> 定义嵌入的对象。
<param> 定义对象的参数。
标签列表（字母排序）
HTML 属性


扫二维码下载贴吧客户端

下载贴吧APP
看高清直播、视频！
分享到: