0

试图通过 Squarespace 网站帮助我的朋友，并尝试在标题代码中添加图像。

我试过集中对齐，但它似乎不起作用。只有填充和边距像素有任何影响，但在使用不同尺寸的显示器时并不一致。

任何帮助是极大的赞赏！

当前代码如下：

<a href="https://wwwmisscurrentcom.squarespace.com/about-1/"><img class=
"thumb-image loaded" data-image-dimensions="960x41" data-image-resolution=
"1500w" data-src=
"https://static.squarespace.com/static/53ce81e3e4b065e3be155770/53cfbd0ce4b056db8c5d3b42/53e4fdb9e4b036cda0551713/1407516127095/header-shipping.png?format=1000w"
id="yui_3_17_2_1_1407515470914_1223" src=
"https://static.squarespace.com/static/53ce81e3e4b065e3be155770/53cfbd0ce4b056db8c5d3b42/53e4fdb9e4b036cda0551713/1407516127095/header-shipping.png?format=1000w"
style="top: 114px; position: relative;margin-left: 150px;"></a>
4

2 回答 2

0

如果您希望它正确居中，则必须访问自定义 css 并使用媒体查询。SquareSpace 中标准像素和百分比的问题在于，您可能会将其集中在您的显示器上，但它并不总是以其他硬件/设备为中心。

于 2014-08-19T08:28:04.340 回答
0

重新阅读您的问题几次后，我想我知道您在问什么。您可以使用 将图像居中margin: 0 auto;。auto左右边距将在所有分辨率和屏幕尺寸上保持块元素（在本例中为 a ）div水平的死点。

有一个 jsBin 的例子！

HTML

<div class="header">
    <img src="http://www.placehold.it/200x100" alt="logo" />
</div>

CSS

.header {
    width: 200px;
    margin: 0 auto; 
    /* 
        shorthand margin = 
        top (0)
        right (auto) 
        bottom (0 - inherited from top) 
        left (auto - inherited from right); 
    */
}
于 2014-08-08T22:25:06.420 回答