发表于: 2016-04-14 10:58:08

2 1688


首先呢,我不知道这是一个好的习惯还是不好的习惯,我不太喜欢碰到什么问题了然后临时去学习这个方面的知识。我花了挺多的时间去学习HTML和CSS的每个标签和属性,一个个看过去,不断的进行试验,花费了大量的时间。但是咱们的目标是成为一个优秀的程序员,所以打好基础也是很有必要的是吧?

废话不多说了,来汇报一下自己这些天的成果。

首先完成了任务3的要求。

Chrome浏览器下的页面。 

Chrome浏览器调试页面。

我的iphone5c上的浏览页面。


下面是代码。

HEML代码部分:

<body>

<div class="back">

<a href="http://www.baidu.com">

<img src="task 3\images\back.jpg" alt="退后"/ id="back">

</a>

</div>

<div id="logo">

<img src="task 3\images\logo.jpg" alt="葡萄藤"/>

</div>

<p>

葡萄藤轻游戏专注于桌游领域,提供在线杀人游戏,捉鬼,炸狼堡等多种聚会游戏以下线下聚会桌游道具。

</p>

<div class="image">

<a href="http://www.youku.com">

<img src="task 3\images\290560933.jpg" alt="290560933"/ class="290560933"></a>

<a href="http://www.jnshu.com/#/skill/home#1">

<img src="task 3\images\BJPTTeng.jpg" alt="BJPTTeng"/ id="BJPTTeng"></a>

</div>

</body>

</html>


CSS代码部分:

<meta charset=utf-8>

<meta name="Conten-Type" content="text/html;charset=utf-8">

<meta name="viewport" content="width=device-width,initial-scale=1">

<style>

body {

background-color:rgb(104,205,213);width:90%;margin:50px auto;

}

p {

font-family:hei;color:white;font-size:14pt;width:80%;margin:30px auto;

text-align:justify;

}

.back{

width:80%;margin:0px auto;position:relative;top:-10px

}

#back{

float:left;height:50px;

}

#logo{

width:191px;margin:0px,auto;

}

.image{

width:80%;margin:20px auto;

}

.290560933{

float:left;height:100px;

}

#BJPTTeng{

float:right;height:100px;

}

</style>

这里有一个问题:

我的两张图片,都进行了CSS的属性定义,但是第一张图片没有被成功定义,但是第二张可以。这个问题可能还需要研究一下,到时候解决了再来更新。




返回列表 返回列表
评论

    分享到