使文本避免的div布局问题

Here是PIC使文本避免的div布局问题

所以这是一个网站，我把主机换一个非营利组织的图片。

的图片是在具有以下属性的div：

position:absolute; right:50px; top:50px;

我想要做的是使文字更明显，因为在不同分辨率的图片会在不同的位置，所以我可以：

-make文字在图片

-or使文本避免DIV（如果可能）

可见

那么，你们有什么想法吗？谢谢:)

来源

2010-07-19 PizzaPie

首先，不可能在绝对定位的div周围流动文本，因为它是从正常流程中取出的;看到http://www.w3.org/TR/CSS2/visuren.html#choose-position

你可以做的是使用以下属性：

float: right; margin-right: 50px;

然后将其放置在正确的地方得到我，这应该达到什么样的你正在尝试做的。如果你把它作为第一个元素，你还可以添加，

margin-top: 50px;

希望有所帮助。

来源

2010-07-19 05:45:33

多数民众赞成正是我正在寻找，我只是利用负边缘，使其看起来更好，其结果我需要，thx这么多 – PizzaPie 2010-07-19 07:24:58

使用这种风格也..这会让你的PIC有点透明..at你想要的不透明度.. ，使文字更清晰。（如果文字不是事先知情同意的一部分）

opacity:0.4;filter:alpha(opacity=40)

来源

2010-07-19 05:44:07 PHP

可读性问题不仅仅与您的背景图像有关。尽量避免在蓝色背景上使用蓝色文本，这将有助于提高可读性。此外，我会避免使用照片作为背景的文字完全（相反，只是使照片的一部分内容）。但是，如果您不希望更改页面的这一部分，我只会选择较暗的背景并使用白色文本。

来源

2010-07-19 05:46:18

我会在文本下方添加一个RGBA背景，并且此区域将占用大约。一半的图片（上半部分或下半部分）。

以幻灯片形式显示的文本以http://www.tenwhil.com/或http://airliquide.com/为例。在后者中检查IE6和IE7的条件注释，其中筛选器用于那些不理解rgba()表示法的浏览器。 -ms-filter是在主样式表，我不想创建一个IE8只是样式表一个指令......

background-color: rgb(64,64,64); /* IE8 */ 
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; 
background-color: rgba(64,64,64, 0.7); /* recent browsers */ 

via conditional comment for IE<8 
background-color: rgb(64,64,64); 
filter: alpha(opacity:70);

编辑：
上述背景下的“小”文本的最糟糕的对比应该是4.5:1为用Color Contrast Analyzer和3:1这样的工具测量标题（14px粗体或18px正常，）

来源

2010-07-19 05:51:45 FelipeAls

使文本避免的div布局问题

回答

相关问题