CSS max-height 与 min-height 教程

在我们常用的定义css高度时经常会设置它一个最大高度max-height 为多少是吧,这样可能性保持页面的漂亮,等一下我们还会讲到min-height 最小高度,下面我们来看看

语法

max-height 属性设置元素的最大高度

看下面的实例。

div
  {
  max-height: 100px
  }

这里就定义当前页面的div高度为100%

好了下面我们接着讲min-height 最小高度哦。

div
  {
  min-height : 10px
  }

最小为100了,那么最大高度与最小高度在javascript如何写呢。下面我们来看看吧。

object.style.minHeight="200px"

object.style.maxHeight="200px"

等吧。最后说明一下还有min-width,max-width方法与上面是一样的做法哦。

本站原创转载请注明来自www.111cn.net/cssdiv/css.html

时间: 2024-09-27 05:05:13

CSS max-height 与 min-height 教程的相关文章

CSS中比较height:100%和height:inherit的不同点

inherit是个好东西,不仅节约代码,尤其与background之流打交道:而且还利于维护. 不过,如果想要继承background的图片,不能这样缩写,会显得很天真: background: #fff inherit left top; 可以这样子: background-image: inherit; height:100%和height:inherit的异同 1. 兼容性差异 height:100% IE6+ √ height:inherit IE8+ √ 2. 大多数情况作用是一样的

css dl dt dd使用实例教程

好了我们再来看一篇css dl dt dd使用实例教程方法了,我们来看效果图. 下面来看看css如何写的吧. <div id="commond">          <span id="commondtitle">用户留言</span>                                                                                   <dl>      

CSS利用图片制作网页圆角图文教程

CSS利用图片制作网页圆角图文教程 背景图定位+全局的思维,一个清晰标准的制作方法就展现在眼前.看图: 

jquery-jQuery中的$(document).height()和$(window).height()

问题描述 jQuery中的$(document).height()和$(window).height() 本来是两个不同的意思,一个是文档的高度,一个是滚动条的高度,为什么我这里有的页面能区分,在我的网站首页就总是相等的呢?求解答 解决方案 $(document).height()表示文档内容的总高度,而$(window).height()表示窗口显示的页面内容的高度,不是滚动条的高度.二者的差值才是滚动图条的高度,一般情况下$(window).height()<=$(document).hei

height:auto和height:100%的区别

一直不明白height:100%和height:auto的区别,最近在制作前端页面时都用了height:100%;overflow:hidden; ,可是有些浏览器出现莫名的奇妙的问题,但换成height:auto就好了,百度过这个问题,却一直没有细看. 今天又浮现了同样的问题,百度细看和群里的朋友指点,终于明白其中的道理,记录一下. height:auto,是指根据块内内容自动调节高度. height:100%,是指其相对父块高度而定义的高度,也就是按照离它最近且有定义高度的父层的高度来定义高

css div 实例三行三列教程

 代码如下 复制代码 <!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"> <head> <meta http-equiv=&qu

7 个基于CSS/JavaScript的鼠标悬停效果教程

鼠标悬停效果是网页制作的常用特效之一,早期使用Flash可以制作非常炫的效果,现在我们同样也可以使用CSS和JavaScript来实现.   本文中,我们将推荐一些非常不错的鼠标悬停特效教程,希望对大家有所帮助! 1.  Hover and Click Trigger for Circular Elements with jQuery 这个教程介绍如何使用jQuery处理一个真正的圆形元素的悬停效果,使用:hover实现悬停.     2.  Original Hover Effects wit

CSS中的font-size属性使用教程

  基本语法结构: Font-size+字体大小数值+单位 单词:font-size 语法:font-size : absolute-size | relative-size | length 取值:xx-small | x-small | small | medium | large | x-large | xx-large xx-small:最小 x-small:较小 small:小 medium:正常(默认值),根据字体进行调整 large:大 x-large:较大 xx-large:最大

巧用CSS的MASK滤镜_基础教程

Mask滤镜可以为网页上的HTML元件对象作出一个矩形遮罩,关于什么是遮罩?如果你用过Flash中的遮罩,你就会知道了,就是那个样子了.实际上对于遮罩你也可以这样来理解,相当于用一块有色布把物件盖起来,但内容却被挖去了.若你还不明白,就看下面的图片再听我给你细说. 图1 mask滤镜效果1 在上面这mask滤镜中用这么深的颜色,主要是让你能清楚地看出效果来.让我们来看一下mask滤镜的参数: 它只有一个参数Color,即遮罩的颜色 以#RRGGBB 格式的颜色值. 你只要在DW3中给它选择一种适

css滤镜属性语法介绍_基础教程

css滤镜  Style属性: 可以应用在标签中,更可用广泛应用在<table><tr><td><body> <center><img><input><font><form><frame><label><map>等等标签中, 更重要的是,它可用在标签中. 页面切换效果: 在页面前部与之间加入"" 说明:duration为页面切换的时间长度,3.