一般情况下,行内元素设置宽高是无效的,常见的有a标签。img和input也属于行内元素,但他们却可以设置宽高!!!!

查阅了一些资料才明白,原来css的元素还有另外一种分类方法,可替换元素,不可替换元素。

a)可替换元素

浏览器根据标签的属性来决定元素的具体显示内容。如img标签,浏览器通过src属性读取图片信息(包括图片的宽高)来显示出来。input标签,通过它的type属性来决定它是文本域(type="text'),还是提交按钮(type="submit")等,对于表单元素,浏览器也有默认的样式,包括宽度和高度。所以替换元素一般存在width和height属性,可以设置或更改其宽高。

b)不可替换元素

大多数元素为不可替换元素,其内容直接表现给客户端(浏览器);

几乎大部分可替换元素都为行内元素,如img,input。所以这也就是为什么行内元素img,input可以设置宽高的原因了。

css中的img和input标签的更多相关文章

  1. input标签写CSS时需要注意的几点(先收藏)

    (从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期2014-05-05) 飞鱼的声纳顶部的搜索框让我头疼了很长时间,原因是总不能获得跨浏览器的统一样式.主要的问题有这么两个:一是inpu ...

  2. 使用CSS3中的input标签与lable标签组合实现banner图的切换

    在做网页时,我们经常可以碰到banner图的切换.对于那些JS薄弱的同学来说,这就很尴尬了.今天,我来告诉大家如何使用CSS做出banner图切换的效果. 这里,用到了lable标签与input的组合 ...

  3. html5中form表单新增属性以及改良的input标签元素的种类

    在HTML5中,表单新增了一些属性,input标签也有了更多的type类型,有些实现了js才能实现的特效,但目前有些浏览器不能全部支持.下面是一些h5在表单和input标签上的一些改动. <!D ...

  4. 纯html+css中实现静态选座位效果技巧(input+label使用小技巧)

    很多时候,我们想通过html+css的方式实现排列在后方的代码在选中状态下,能控制排列在前的代码的样式.那么要怎么实现呢?在这里我就要用1个小技巧来完成. 众所周知的,我们css中的选择器通常只能向下 ...

  5. CSS中html的标签元素分类

    在CSS中,html中的标签元素大体被分为三种不同的类型: 块状元素.内联元素(又叫行内元素)和内联块状元素.    常用的块状元素有:  <div>.<p>.<h1&g ...

  6. HTML中强大的input标签属性

    用了许久的html,<input>这个标签是最常用的标签之一. <input type="">标签中type属性是必不可少的,以往我最常用的有 type=& ...

  7. 控制input标签中只能输入数字以及小数点后两位

    js 代码如下: /* 控制input标签中只能输入数字 和小数点后两位 */ function checkNum(obj) { //检查是否是非数字值 if (isNaN(obj.value)) { ...

  8. CSS中zoom:1的作用 ,小标签大作用

    CSS中zoom:1的作用兼容IE6.IE7.IE8浏览器,经常会遇到一些问题,可以使用zoom:1来解决,有如下作用:触发IE浏览器的haslayout解决ie下的浮动,margin重叠等一些问题. ...

  9. Web前端开发如何利用css样式来控制Html中的h1/h2/h3标签不换行

      H1/H2/H3/H4标题标签常常使用在一个网页中唯一标题.重要栏目.重要标题等情形下. H1在一个网页中最好只使用一次,如对一个网页唯一标题使用.H2.H3.H4标签则可以在一个网页中多次出现, ...

随机推荐

  1. 【解题报告】[动态规划] RQNOJ - PID38 / 串的记数

    原题地址:http://www.rqnoj.cn/problem/38 解题思路: 状态表示:dp[i][j][k]表示i个A,j个B,k个C组成的满足条件的字符串的个数 初始状态:dp[0][0][ ...

  2. linux下安装虚拟机qemu kqemu

    一,为什么要装虚拟机,为什么选择qemu 我的系统里面有3个linux系统,这些系统都是独立的,有的时候,我想一台电脑,能更真实的模拟二台,这个时候我们就可以装个虚拟机.其实如果真的很有钱的话,可能考 ...

  3. ArcGIS Engine 捕捉

    原文 ArcGIS Engine 捕捉 bool bCreateElement = true; ;//时间间隔 ;//初始值 IElement m_element = null; //界面绘制点元素 ...

  4. memcache、memcached、groupcache的区别

    对PHP语言来说,PHP使用memcache有两个模块,分别叫memcache和memcached,他们的区别看下表: 参考:http://hi.baidu.com/tony_wd/item/605e ...

  5. 使用Drush管理Drupal站点

    Drush(Drush = Drupal + Shell)就是使用命令行命令来操作Drupal站点,它的命令格式与git类似,都是双字命令(drush + 实际的命令).既然是命令行命令,也就可以使用 ...

  6. unity3d Human skin real time rendering 真实模拟人皮实时渲染(转)

    先放出结果图片...由于网上下的模型是拼的,所以眼皮,脸颊,嘴唇看起来像 存在裂痕,解决方式是加入曲面细分和置换贴图 进行一定隆起,但是博主试了一下fragment shader的曲面细分,虽然细分成 ...

  7. Beginner’s Guide(开始者向导)

    This guide gives a basic introduction to nginx and describes some simple tasks that can be done with ...

  8. 为什么要Cssreset

    1.CssReset是什么?由于html标签在各浏览器的默认样式解析出来的有所不同.例如<ul>标签在IE.firefox.chrome浏览器下默认边距是不一样的.各浏览器的默认样,会给我 ...

  9. 拜托,这才是“Uber”的正确读法

    在美国,私家车主可以注册成为Uber司机,这对传统的出租车行业形成了很大的挑战,同时也让Uber始终处于舆论的风口浪尖. 7月14日,美国用车应用Uber正式宣布进入北京市场.在进入中国后,Uber选 ...

  10. 为网页设计师准备的30个使用的HTML5框架

    原文地址:http://www.goodfav.com/zh/html5-framework-8189.html 网页设计师在开始使用一些应用程序之前需要考虑几个事实,以确保在应用Web程序框架时,这 ...