体育资讯网

您现在的位置是:首页 > 分类10 > 正文

分类10

html网页源码案例(html5网页设计项目源码)

hacker2022-06-09 18:37:23分类1055
本文目录一览:1、如何用html编写一个简单的网页

本文目录一览:

如何用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

发表评论

评论列表

  • 澄萌乙白(2022-06-10 03:26:47)回复取消回复

    0 auto; border:1px dashed #000000; padding:4px;}.titles{ width:100%; text-align: center; color:#ffffff; background-color: #ff0000;}.img-bo

  • 馥妴栖迟(2022-06-10 04:27:06)回复取消回复

    本文目录一览:1、如何用html编写一个简单的网页2、html网页制作、跪求源代码3、求html静态网页源码4、找一点html5写的源代码案例,供初学者学习如何用html编写一个简单的网页简单的html网页可以直接利用文本编写的html网页源码案例,无需下载特定编辑器。1、在html网

  • 纵遇辙弃(2022-06-10 01:55:15)回复取消回复

    itles{ width:100%; text-align: center; color:#ffffff; background-color: #ff0000;}.img-box{ width:1

  • 北槐岁吢(2022-06-09 23:19:48)回复取消回复

    本文目录一览:1、如何用html编写一个简单的网页2、html网页制作、跪求源代码3、求html静态网页源码4、找一点html5写的源代码案例,供初学者学习如何用html编写一个简单的网页简单的html网页可以直接利用文本编写的html网页源码案例,无需下载特定编辑器。1、在html网页源码案例

  • 掩吻各空(2022-06-10 00:50:25)回复取消回复

    .src="img/colon.JPG"; }else{ aImg[i].src="img/"+str.charAt(i)+".JPG"; } } } function toZe