`
bluedusk
  • 浏览: 270238 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

具有亲和力的文字隐藏方法

阅读更多


一个新的,更加具有亲和力的CSS隐藏文字方法介绍,来自sonspring.com ,说明为什么现有的几种CSS隐藏文字的方法的缺陷和新的方法如何弥补。实用性一般,但是这个方法挺新颖的。
1.display:none;的缺陷

  • 搜索引擎可能认为被隐藏的文字属于垃圾信息而被忽略,来自SEO Mistakes: Unwise comments
  • 屏幕阅读器(是为视觉上有障碍的人设计的读取屏幕内容的程序)会忽略被隐藏的文字。

2. visibility: hidden ;的缺陷
这个大家应该比较熟悉就是隐藏的内容会占据他所应该占据物理空间
3.overflow:hidden;一个比较合理的方法.texthidden
{
 display:block;/*统一转化为块级元素*/
 overflow: hidden;
 width: 0;
 height: 0;
}

就像上面的一段CSS所展示的方法,将宽度和高度设定为0,然后超过部分隐藏,就会弥补上述一、二方法中的缺陷,也达到了隐藏内容的目的。
延伸阅读:
Google, SEO and using CSS to hide text
术语:
可访问性(Accessibility)
是使残疾人更容易地使用应用程序的惯例。
1990 年的美国残疾人法案(The American Disabilities Act)
1996 年的电信法案(The Telecommunications Act)
1998 年的康复法案修正案(Rehabilitation Act Amendments)508 条款
万维网联盟(W3C)的 Web 可访问性倡议(Web Accessibility Initiative(WAI))
这些都是可访问性标准。在 Law and disabilities页面上可获得更多信息。
屏幕阅读器(Screen Reader)
是为视觉上有障碍的人设计的读取屏幕内容的程序。

可用性(Usability)
使每个人都更容易地使用应用程序的惯例。可访问性是可用性中的一类。
Web 浏览器(Web Browser)
可以显示 Web 页面的任何程序。大多数 Web 浏览器可以显示 HTML 页面,但有些(诸如移动电话中的浏览器)可能只显示诸如 WML 或 cHTML 那样的其它类型的页面。

来源:http://www.jluvip.com/blog/article.asp?id=348

分享到:
评论

相关推荐

    企划工具箱.ppt

    这涉及到品牌的声誉、个性和沟通方式,如何让消费者在心理上与品牌产生连接,例如通过体现品牌的可靠性、亲和力或者独特风格。 在实践中,策划工具箱中的方法论提醒我们,有时可能会过于关注“值得信赖”的品牌形象...

    卡通背景PSD模板

    在网页设计中,使用这样的模板能够帮助设计师高效地创建出吸引儿童或青少年群体的网站,因为卡通风格通常与趣味性、活力和亲和力相联系。PSD模板的使用可以节省大量时间,特别是在需要保持一致视觉风格的多个页面...

    儿童模板 (2).pptx

    可以使用有圆润边角的字体,增加亲和力。 4. **布局设计**:保持页面简洁,避免过多的文字。利用图片、图标和简短的句子来传达信息。每个幻灯片的内容应聚焦在一个主要点上,避免信息过载。 5. **动画和过渡效果**...

    手绘大数据动态PPT模板-灰-PPT模板.pptx

    手绘元素则增加了亲和力和创意,使数据展示更加生动有趣。 【动态展示】 动态PPT模板在大数据展示中具有显著优势,它可以利用动画效果来呈现数据变化过程,帮助观众更好地理解和记忆数据间的关联。例如,通过图表...

    韩国商务美女PSD模板

    韩国风格的设计通常以其简洁、优雅和时尚感闻名,尤其在商务领域,这种风格往往能够展现出专业且不失亲和力的形象。模板中的商务美女形象可能是现代、干练的,配合韩国流行的色彩搭配,为网页增添了一种独特的东方...

    PSD儿童相册模板下载

    设计师可能会选用手写体、卡通字体或个性化的装饰字体,以增加趣味性和亲和力。 7. **导出与兼容性**:完成设计后,用户可以将PSD模板导出为其他格式,如JPEG、PNG或PDF,以便于打印或在线分享。不过,需要注意的是...

    文艺高逼格17.pptx

    - **个性化元素**:如兴趣爱好、个人价值观等,增加亲和力。 #### 设计建议 - **视觉一致性**:保持页面风格与整体模板一致。 - **突出重点**:通过颜色、字体大小等方式突出关键信息。 - **交互元素**:如添加动画...

    六一儿童节海报模板

    可以使用手写体或卡通风格的字体,增加亲和力和趣味感。 4. **布局设计**:海报的布局需要有层次感,信息分布要清晰,主要信息(如活动名称、时间、地点)应突出显示。 5. **图片处理**:若使用图片,需注意版权...

    新绛事业编招聘2018年考试真题及答案解析打印.docx

    8. 人力资源专家认为女性在管理方面有优势,如沟通能力和亲和力,适合于营造团队凝聚力和激发员工积极性。这段话没有提到女性在智力上的生理差异。 9. 宪法具有最高法律效力,一切规范性文件不得与其冲突。法律效力...

    psd源文件人物素材

    同时,由于素材是针对宝宝的,因此在设计时要考虑色彩的鲜艳度、图案的童趣性和整体的亲和力,以吸引小朋友们的注意力。在实际操作中,设计师还需要结合Photoshop软件的功能,如滤镜、特效、调整工具等,来优化和...

    重金招募PS招聘海报

    【校园招聘】则要求海报具有亲和力和吸引力,能够引起学生群体的兴趣。可以考虑使用年轻、活力四溢的元素,如校园场景、年轻人群体的插图,或者结合当前流行趋势,以吸引应届毕业生的眼球。 至于提供的文件【psd...

    手持海报样机PSD模板

    “海报样机”通常包含各种角度和场景,比如墙上挂贴、立柱展示、桌面摆放等,而“手持海报样机”则特别强调了人的参与,增加了视觉上的互动性和亲和力。这种样机设计有助于设计师在未实际印刷之前,就能评估设计在...

    两张紫色渐变时尚PPT背景图片

    蓝色曲线可能代表着动态和连贯性,粉色小球则为整体设计增添了一丝趣味性和亲和力。这样的装饰元素可以使观众的视线自然地在页面上流动,引导他们关注到你想要强调的内容。 4. **.PPTX格式**:这是一种微软...

    韩国广告设计模板下载

    3. **插图与图形**:韩国风格的插图常带有卡通化或者手绘的元素,具有较强的亲和力和辨识度。 4. **字体选择**:韩国广告设计中的字体往往简洁明快,有时会结合手写字体,营造出温馨、个性化的氛围。 5. **排版**...

    欢迎新同学PSD开学季海报

    5. **图形元素与插图**:标签中的“卡通”暗示设计可能包含一些卡通风格的图形,如卡通人物、文具等,这些元素能增加亲和力,吸引年轻观众的注意。使用矢量图形(如AI或EPS格式)可以确保这些元素在放大时不失真。 ...

Global site tag (gtag.js) - Google Analytics