html5 css 文本缩进,使用 css 文本缩进和 padding 隐藏文本 -凯发ag旗舰厅登录网址下载

一个网站都会有一个 logo，这似乎是一条通用的布局和内容，而对于这个 logo 的代码编写，一般都会使用 插入 logo 图片，然后再写上文字的描述，其实这样的方法有点过时了，因为这些描述文本只针对于这张 logo 图片，而放置更多的内容时候，搜索引擎不认为和网页的内容有多大的关系。

text-indent

css中的 text-indent 属性是设置段落文本缩进，如果我们给他设置 text-indent:100%，那么文本将会空一行出来，通过这个属性，我们可以应用到我们 logo 布局中。

我们将 logo 图片作为背景图放置到标签里面，然后添加 text-indent 属性，文本不换行，超出部分隐藏，那么这些文本将不会显示，也不会被搜索引擎判断为作弊。

.logo {

text-indent: 100%;

white-space: nowrap;

overflow: hidden;

background: no-repeat;

height:24px;

width:72px;

}

在 .logo 容器里面放置再多的内容，都不会显示出来。

padding

padding 属性用于设置元素的填充，同样我们定义背景图，而将 padding 设置为和容器一样的宽度，然后容器的宽度设置为 0，那么容器里面的内容也不会显示出来。

.logo {

padding-left:72px;

overflow: hidden;

background: no-repeat;

height:24px;

width:0;

}

上面两个隐藏文本的方法不同于以往的搜索引擎作弊方法，他不是直接将文本设置 display:none; 隐藏起来，而是通过合理的计算方式，让文本隐藏。

总结

以上是凯发ag旗舰厅登录网址下载为你收集整理的html5 css 文本缩进,使用 css 文本缩进和 padding 隐藏文本 - 文章教程的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得凯发ag旗舰厅登录网址下载网站内容还不错，欢迎将凯发ag旗舰厅登录网址下载推荐给好友。