2013-04-24 137 views
1

我是一名程序员,而不是设计师,我不喜欢编写HTML和CSS代码。很长时间以来我一直在使用桌子进行布局。现在,我想打破这种不好的做法,并开始在我的网站中使用div。这对我来说是一个非常重要的决定。因为我真的讨厌使用div的。初学者的Div定位教程

与往常一样,我开始阅读书面代码,以了解div的定位如何工作,这是我学习新知识的最佳途径。但是,我真的无法理解。我认为有什么不对。我真的应该不会那么辛苦。这个div“API”写错了,应该更简单一些。但是,我知道这个讨论是无意义的。

现在我很困惑与下列项目的使用,

float, clear, inline, block, position, relative, absolute 

我在寻找网站,计算器职位,教程学习的div谁拥有编程背景像我这样的初学者。 PS:我检查了W3的CSS标准。但是,它太长和详细。我想要更短,更容易理解的实用目的。

+2

另外,请记住,谷歌是你最好的朋友 – 2013-04-24 11:57:32

+3

目前,我最好的朋友是表的,可悲的是。 – Sait 2013-04-24 11:59:04

+0

-1对不起,但已经有这么多的教程(过去10多年),很难相信必须有“帮我谷歌这个”这个问题。 – Damb 2014-06-04 13:37:11

回答

3

当我在教自己的HTML时,我花了很多时间在W3Schools网站上。我根本无法找到一个更好的地方来学习HTML和CSS。下面是一个说明浮动是如何工作的示例代码:

<!DOCTYPE html> 
<html> 
<head> 
<style> 
img 
{ 
float:right; 
} 
</style> 
</head> 

<body> 
<p>In the paragraph below, we have added an image with style <b>float:right</b>. The result is that the image will float to the right in the paragraph.</p> 
<p> 
<img src="http://vsual.co/wp-content/uploads/2011/09/HumanRightsLogo_CO.jpg" width="95" height="84" /> 
This is some text. This is some text. This is some text. 

</p> 
</body> 

</html> 

如果您仍然不确定,请免费参观W3Schools link 1W3Schools Editor

我希望这有助于

+0

虽然w3schools *可能会为简单的东西好,我建议反对它。他们出现在最高层,因为他们为那个位置买单 - 并不是因为他们是最好的。欲了解更多信息,http://www.w3fools.com – SacredSkull 2013-10-17 17:02:17

+0

@SacredSkull我知道它,但如果一个教程是简短和简洁的,为什么浪费“宝贵”的时间挖掘时,你可以使用w3s。我并不是说它好或坏,而只是个人喜好的问题。 – 2013-10-24 10:25:48

1

我会建议您检查出的文章下跌http://net.tutsplus.com和相关的webdesign.tutsplus网站。

在他们的网络上也有一个非常好的CSS介绍课程,但它不是免费的。

无论如何,这并不难。

你有几种类型的元素:块,内联和在线块,你会用得最多。其他将被使用以及默认值。

Div是块元素,所以它们通常需要它们的父元素的重量和它们所需的高度。为了形成复杂的布局和列,有时候我们使用float,它通过将div放在页面流之外来改变它,所以其他元素堆叠在它旁边。

这是一个非常粗糙,也许不够准确的描述,但应该作为一个起点。

也绝对看看这个:http://learnlayout.com 这是一个很好的解释CSS布局的例子。

我希望这会帮助你找到你的方式。