CSS实例教程:把title给显示出来参与页面布局

文章简介:显示一些如title/meta之类的特殊元素。

title代表的是页面的标题,很多时候跟h1的内容是一样的。

我在写页面的时候感觉总是重复一次很麻烦,
于是就索性把h1给删了,把title给显示出来参与页面布局,
这样整个页面就有趣多了
代码很简单


  1. head,title{display:block;}

是的,只有一句话,让head和title都显示。
此外如果还对其他有兴趣,可以把meta、script还有style等都显示出来

另外,下面这句也会很有趣


  1. body style, body script{
  2. display:block;
  3. white-space: pre;
  4. }

可以让body中的script何style都原样显示出来,
怎么用好就靠大家自己发挥了。

当然,我们亲爱的IE6是不支持上面两个小功能的。
Firefox 3.6.6 和 Chrome 6.0.458.1 测试通过。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索布局
, 页面
, script
, title
, body
, style
title显示
,以便于您获取更多的相关知识。

时间: 2024-08-19 08:03:50

CSS实例教程:把title给显示出来参与页面布局的相关文章

CSS实例教程:简单的button风格的UI按钮

文章简介:CSS实例教程:简单的button风格的UI按钮. button应该是UI库中最常用到的一种.我个人对google+的那种简单的button风格比较喜欢,因为那样在不同的浏览器下视觉差异不是很大.不过现在自己确实已经没有心思去琢磨怎么去弥补ie的不足,所以下面的东西就不要拿ie打开了.还是贴出代码吧 <!DOCTYPE html> <html> <head>                        <title></title> 

CSS实例教程:简单的的滑动导航栏效果

文章简介:CSS实例教程:简单的的滑动导航栏效果. 由于网页字体的限制,以及对导航栏美观的需求,使用background-repeat来做一个简单的文字导航栏已经远远不够了.在很多场合,导航栏的背景是一个图案,字体也不再是单调的宋体,这就需要我们把导航栏的整体效果做图在网页中使用. 今天我们就来做一个简单的的滑动导航栏效果(不知道应该叫它什么^_^),效果如下图:   思路:通过改变链接鼠标悬停状态(hover)的背景图片,来达到把鼠标放上去有高亮显示的效果. 方法:在本例中,我们是通过调整各链

CSS实例教程: 网页中制作浮层叠加效果

文章简介:CSS Overlay技巧. 创建遮照图有几种技术:从使用绝对定位的元素到outline和伪元素.在本文中,我们将探索每个技术的实现样式以及他们之间的利与弊. 设计模式通常是一组最佳实践和技术,主要目的是用来解决一些最常见的设计"问题",通常是在上下文中提出的设计原则.这些原则之是一"停留在页面"的原则.这一原则是建立在页面刷新都打破用户的心中想要的流程基础上,造成所谓的"变盲",我们需要用户无论保时何地可以避免打破这种视觉流程. 我们

CSS实例教程;使用:before和:after插入内容

文章简介:我们使用:before来在元素的前面插入内容,使用:after在元素的后面插入内容(兼容浏览器:firefox.chrome.safari.opera.ie8+). 在css中,我们可以使用:before伪元素选择器与:after伪元素选择器在页面的前面和后面以content属性的方式插入内容. 从css2.0添加这两个伪元素选择器到css2.1到现在的3.0,都不断的在对这两个选择器进行改良和扩展. 首先,我们来看一下,在css2中,我们如何来插入内容(ie6 7不在考虑范围之内,因

CSS实例教程:用列表ul制作CSS横向菜单的基础知识

在前面的文章中学习<用列表ul制作CSS横向菜单的基础知识>/article.asp?id=395.实现的原理我们都能理解了,但这样的菜单还远远不能满足我们的需要,我们需要制作出比较美观的菜单,我们今天学习让菜单有一个矩形的背景,并且当鼠标激活时能有所变化(hover).废话不多说了,让我们开始吧! <ul id="nav">       <li><a href="http://www.111cn.net/">Div+

CSS实例教程:微博新版查看大图前后浏览效果

文章简介:微博新版查看大图前后浏览的另外一种实现. 一.新浪微博新版查看大图 你说我是先讲些废话呢还是讲些废话呢~~ 搜索"新版微博查看大图",结果前三如下: 其实这种效果,我在人人先见到,然后贴吧啊,还有我不使用的QQ空间等--按照我以往的经验,估计是从老美哪个网站copy过来的,然后,A闯红灯,B闯红灯,C也闯红灯,此时D觉得自己不闯红灯就不正常,于是也朝着红色的方向大步夺去. 数据上的好与不好,我不是专业的,随便乱说会烂舌头的.从个人感性认识上,微博似乎多了一件饰品. 青菜萝卜各

CSS实例教程:制作漂亮的网页表单

初中级练习,高手朋友们可以飘过.要求达到如下图所示的效果,各位不妨试一试~   代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang=

CSS实例教程:PNG背景透明在网页设计中的运用

文章简介:PNG的背景透明在网页中应用比较广泛,但浏览器的兼容问题一直很让人头疼,用的CSS滤镜再变通一下也能实现PNG背景半透明的兼容问题,只不过不支持背景的定位而已,也就是说不支持CSS SCRIPT. PNG的背景透明在网页中应用比较广泛,但浏览器的兼容问题一直很让人头疼,用的CSS滤镜再变通一下也能实现PNG背景半透明的兼容问题,只不过不支持背景的定位而已,也就是说不支持CSS SCRIPT. 一.CSS 滤镜(两种方法) 一般能用CSS处理的就尽量不要用JS了,个中的原因,你懂的--

CSS实例教程:CSS Selector的优先级

文章简介:11个class与一个id"谁的优先级高的问题. 上周五下班前我们敬爱的三三大人又在组里讨论了关于"11个class与一个id"谁的优先级高的问题-_-! 猜一下 01 <!DOCTYPE HTML> 02 <html> 03 <head> 04 <meta charset="utf-8"> 05 <style type="text/css"> 06 body{fon