一般情况下,行内元素设置宽高是无效的,常见的有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. HDU 4741

    获得 新的模板了/// 此模板 有线段和线段的最短距离方法,同时包含线段与线段的最短距离:#include<iostream> #include<stdio.h> #inclu ...

  2. 【转】使用Python的IDE:Eclipse+PyDev

    原文网址:http://www.crifan.com/try_with_python_ide_eclipse_pydev/ 之前已经介绍过了一些基本知识: [整理][多图详解]如何在Windows下开 ...

  3. canvas小知识

    清单 1. 绘制 canvas 矩形 function drawRect(){ var canvas = document.getElementById('canvas'); if (canvas.g ...

  4. InnoDB: Error: could not open single-table tablespace file

    找到\mysql\bin下面的my.ini中mysqld项目后添加 innodb_force_recovery = 1

  5. C#中的枚举类型(enum type)

    ylbtech 原文 C#中的枚举类型(enum type) 概念 枚举类型(enum type)是具有一组命名常量的独特的值类型.在以下示例中: enum Color { Red, Green, B ...

  6. 【C++】非原创|统计代码覆盖率(一:C++)

    也是转别人的,因为我c++好菜好菜啊... http://blog.chinaunix.net/uid-23741326-id-3316943.html c++跟C基本是一样的,统计覆盖率,需要生成g ...

  7. linux(centos7)下安装tomcat7

    1.下载tomcat1.7.tar.gz 2.将文件放到/usr/local中 #cp tomcat1.7.tar.gz /usr/local 3.进入到/usr/local中,解压缩tomcat1. ...

  8. WCF配置文件全攻略

    參考:http://www.cnblogs.com/wayfarer/archive/2007/08/24/867987.html http://www.cnblogs.com/scy251147/a ...

  9. How To Set Up Port Forwarding in Linux

    Port forwarding usually used when we want our computer act like a router. Our computer receive the p ...

  10. Hadoop 问题 & 解决

    1.将旧版本hadoop升级后,如从hadoop-1.1.2升级到hadoop-1.2.1,会发现使用start-all.sh命令,没有办法启动namenode,即jps,发现没有namenode 原 ...