html网页源码案例(html5网页设计项目源码)
本文目录一览:
如何用html编写一个简单的网页
简单的html网页可以直接利用文本编写的html网页源码案例,无需下载特定编辑器。
1、在html网页源码案例我们的windows操作系统中,桌面上鼠标右键新建一个txt文本,并命名为"最简单网页",只是便于标识,实际上并不影响我们的操作。注意我们需要提前在文件属性中把扩展名显示出来。
2、我们打开文件夹属性设置,将文件扩展名显示出来,后面我们需要对文件扩展名进行操作,不同操作系统的设置位置不太一样,我们可以直接搜索"文件夹属性"来进行查找修改。
3、然后输入最简单的HTML文本语言。
代码如下:
html
body
最简单的网页
/body
/html
4、保存并关闭txt文本,然后修改我们txt文本的扩展名为html,此时会弹出警告框,提示我们修改后可能会导致文件不能使用,这是操作系统的一个处理逻辑,为html网页源码案例了防止无意或恶意的损坏文件的行为。
5、无需担心,因为这在我们自己的掌控之下,确认警告,点击"是",然后双击打开我们自己的第一个html网页,就可以看到一个最简单的html网页了。
html网页制作、跪求源代码
效果图html网页源码案例,图片自己换html网页源码案例,
html代码html网页源码案例:
!DOCTYPE html
html
head
meta charset="utf-8"/
title泰国/title
link rel="stylesheet" type="text/css" href="css/index.css"/
script type="text/javascript" src="js/index.js"/script
/head
body
div class="1c72-802d-8ed8-f892 box"
div class="802d-8ed8-f892-ae3c titles"泰国/div
div class="8ed8-f892-ae3c-a826 img-box"
img class="f892-ae3c-a826-3e64 auto-img" src="images/a001.jpg"/
/div
div class="ae3c-a826-3e64-ee57 text-box"
div class="a826-3e64-ee57-8e38 text-box-a"
a href="#"曼谷、芭提雅(珊瑚岛、金沙岛)5晚7天/a
/div
div class="3e64-ee57-8e38-a744 text-box-a"
东航直飞曼谷客机,入住1晚曼谷国际5星+4晚泰式5星酒店,芭提雅双岛(珊瑚岛+金沙岛)清...
/div
div class="ee57-8e38-a744-19d5 text-box-a"
出发日期:星期一,星期二,星期三,星期四,星期五
/div
/div
div class="8e38-a744-19d5-931d bottom ovf"
div class="a744-19d5-931d-4140 fl text-a1"
班期:每周发团
/div
div class="19d5-931d-4140-4f0a fr"
div class="94a1-30fe-d68c-cf8b price"¥nbsp;4549/div
div class="30fe-d68c-cf8b-1c72 rush-to-buy"立即抢购/div
/div
/div
/div
/body
/html
css样式:
html,body{
padding:0;
margin:20px 0 0;
}
a{
text-decoration:none;
}
.fl{
float:left;
}
.fr{
float:right;
}
.ovf{
overflow: hidden;
}
.box{
width:50%;
margin:0 auto;
border:1px dashed #000000;
padding:4px;
}
.titles{
width:100%;
text-align: center;
color:#ffffff;
background-color: #ff0000;
}
.img-box{
width:100%;
margin-top: 4px;
}
.auto-img{
display: block;
width:100%;
}
.text-box{
width:100%;
}
.text-box-a{
width:100%;
font-size: 14px;
line-height: 20px;
letter-spacing: 1px;
}
.text-box-aa{
color:#0089ff;
}
.bottom{
margin-top: 30px;
}
.text-a1{
font-size: 18px;
font-style: italic;
font-style:oblique;/*为保证斜体效果加一个*/
}
.price{
font-size: 16px;
color:#8B3E2F;
}
.rush-to-buy{
width:80px;
text-align: center;
background-color: #ff0000;
font-size: 16px;
}
求html静态网页源码
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""
html xmlns=""
head
meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
title溅/title
style
!--
body {
background:url(img/bg9.gif);
margin:0px;
padding:0px;
}
.pic{
border:1px solid #00406c;
}
p {
padding-top:30px;
color:#001671;
}
p.con{
padding-left:4px;
padding-right:4px;
}
p.title {
paddin-top;0px;
}
.chara1 {
font-size:12px;
background-color:#90bcff;
}
.chara1 td{
text-align:center;
}
.chara2 {
background-color:#d2e7ff;
text-align:center;
font-size:12px;
vertical-align:top;
}
.chara3 {
background:#e9fbff url(img/self.jpg) no-repeat bottom right;
vertical-align:top;
padding-top:15px;
padding-left:30px;
font-size:12px;padding-right:15px;
}
--
/style
/head
body
table align="center" cellpadding="1" cellspacing="0"
trtdimg src="img/banner3.jpg" border="0" //td/tr
/table
table width="600px" cellpadding="2" cellspacing="2" class="cf8b-1c72-802d-8ed8 chara1" align="center"
trtd首面/tdtd心情日记/tdtdFree/tdtd一起走到/tdtd从明天起/tdtd纸飞机/tdtd下一站/td/tr
/table
table width="600px" align="center" cellpadding="0" cellspacing="1"
tr
td width="150px" class="1c72-802d-8ed8-f892 chara2" pimg src="img/selfpic.jpg" class="802d-8ed8-f892-ae3c pic"/br /我的日记本/p
p class="8ed8-f892-ae3c-a826 con"他们彼此深信,是瞬间并发的热情让他们相遇。这样的确定是美丽的,但变幻无常更为美丽。/p
p img src="img/selfpic2.jpg" class="f892-ae3c-a826-3e64 pic"/br/心情轨迹/p
p class="ae3c-a826-3e64-ee57 con"董事长的一切都让人既羡慕又忌妒,但更让人受不了的是,有一天,上苍忽然赐给他一个神奇的礼物/p /td
td class="a826-3e64-ee57-8e38 chara3"
h4介绍/h4
p我努力的抓紧世界,最后却仍被世界淘汰,如果一开始就松手,我会不那么伤心吗?你说,亲爱的孩子,世事难料,随它去吧!/p
h4照相本子/h4
p关于童年,你记住了什么? br
两岁时,我拥有一只巨大的粉红猪,它总在我嚎啕大哭时逗我笑。br
三岁时,我骑着小木马一路摇到外婆家,它不喝水也不吃草。br
四岁时,我离家出走,在公车上睡着了,最后是太空超人送我回家。br
我真的没骗你,我通通都记得,还有照片为证。
/p
h4地下铁/h4
p天使在地下铁的入口,br
和我说再见的那一年,br
我渐渐看不见了。br
十五岁生日的那年秋天早晨,br
窗外下着毛毛雨,br
我喂好我的猫。br
六点零五分,br
我走进地下铁。/p
h4向左走向右走/h4
pThey're both convincedbr
that a sudden passion joined them.br
Such certainth is beautiful,br
but uncertainty is more beautiful still./p
br
/td
/tr
/table
/body
/html
找一点html5写的源代码案例,供初学者学习
首先准备好11张图片html网页源码案例,放到img文件夹下供调用
代码如下html网页源码案例:
!DOCTYPE html
html
head
meta charset="UTF-8"
title/title
/head
body
p/p
img src="img/0.JPG" /
img src="img/0.JPG" /
img src="img/colon.JPG" /
img src="img/0.JPG" /
img src="img/0.JPG" /
img src="img/colon.JPG" /
img src="img/0.JPG" /
img src="img/0.JPG" /
script
//var oBody=document.body;
var oP=document.getElementsByTagName("p")[0];
var aImg=document.getElementsByTagName("img");
fn();
setInterval(fn,1000)
function fn(){
var mytime=new Date(); //当前html网页源码案例的系统时间 年月日 时分秒 星期 对象
var iHour=mytime.getHours();//小时
var iMin=mytime.getMinutes();//分钟
var iSen=mytime.getSeconds() ;//秒钟
var str="";
//220640
str=toZero(iHour)+":"+toZero(iMin)+":"+toZero(iSen);
oP.innerHTML=str;
for(var i=0;iaImg.length;i++){
if(str.charAt(i)==":"){
aImg[i].src="img/colon.JPG";
}else{
aImg[i].src="img/"+str.charAt(i)+".JPG";
}
}
}
function toZero(n){
if(n10){
return n="0"+n;
}else{
return n=""+n;
}
}
/script
/body
/html