网站HTML的代码怎么查找的呢?

网站HTML的代码怎么查找的呢?,第1张

通俗了解,通过html语法规则让图片、文字等内容,在浏览器显示出来的代码我们称之为网页源代码。源代码(源文件)是指网页的html代码,这里可以将CSS代码也称为CSS源代码。

第一种:打开一个网页后点击鼠标的

右键就会有"查看源文件", *** 作 鼠标右键--->查看源文件 即可d出一个记事本,而记事本内容就是此网页的html代码。可能会碰到一些网页鼠标右键无反应或提出提示框,那是因为做网页的加入了JS代码来禁止用户查看源文件代码或复制网页内容,但是这种方法也没用,只有你稍微懂得以下第二种方法即可查看此网页的源代码源文件。

第二种:通过浏览器状态栏或工具栏中的点击

“查看”然后就用一项“查看源代码”,点击查看源代码即可查看此网页的源代码源文件。在微软IE下截图:在微软IE下 查看--->源文件 即可查看此网页代码在傲游浏览器下截图:

查看别人网页的源代码可以为我们制作网页时候有帮助,以后将介绍查看源代码更多方法及怎么运用到别人的源代码文件。

第三种:也可以通过一些网页查找源代码的网站去搜索,有一些专门的这些网站的,只需要你想要网站的地址就可以了。

效果图,图片自己换,

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="box">

  <div class="titles">泰国</div>

  <div class="img-box">

    <img class="auto-img" src="images/a001.jpg"/>

  </div>

  <div class="text-box">

    <div class="text-box-a">

      <a href="#">曼谷、芭提雅(珊瑚岛、金沙岛)5晚7天</a>

    </div>

    <div class="text-box-a">

      东航直飞曼谷客机,入住1晚曼谷国际5星+4晚泰式5星酒店,芭提雅双岛(珊瑚岛+金沙岛)清...

    </div>

    <div class="text-box-a">

      出发日期:星期一,星期二,星期三,星期四,星期五

    </div>

  </div>

  <div class="bottom ovf">

    <div class="fl text-a1">

      班期:每周发团

    </div>

    <div class="fr">

      <div class="price">¥&nbsp4549</div>

      <div class="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-a>a{

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

}


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7484337.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-06
下一篇 2023-04-06

发表评论

登录后才能评论

评论列表(0条)

保存