51dev.com IT技术开发者社区

51dev.com 技术开发者社区

多个div排列在同一行而不换行

多个div排列在同一行而不换行

 有时候,我们可能会产生多个div标签横向排列而不换行的需求,具体有以下几种实现方法:例如:<html><head></head><body><divid="container"><divclass="lable">测试测试&l...

textarea标签中resize属性的设置

textarea标签中resize属性的设置

CSS3中新增了resize缩放属性,这个属性可以应用到任意元素。 目前只有Webkit内核的浏览器才支持这个css3属性,即Googlechrome和Applesafari都支持。 而textarea标签中,Webkit内核的浏览器会默认resize的值为both,即用户可以调...

box-sizing: border-box;的作用

box-sizing: border-box;的作用

box-sizing属性可以被用来调整这些表现:content-box 是默认值。如果你设置一个元素的宽为100px,那么这个元素的内容区会有100px宽,并且任何边框和内边距的宽度都会被增加到最后绘制出来的元素宽度中。border-box 告诉浏览器去理解你设置的边框和内边距的...

CSS伪类伪元素详解

CSS伪类伪元素详解

CSS选择器大致可以分成5类:基本选择器,层次选择器,属性选择器,伪类,伪元素。基本,层次,属性选择器比较容易理解,毕竟它们选择的对象都属于DOM中看得见摸得着的元素。但伪类和伪元素相对比较抽象,稍微有一点点理解上的难度。本篇就是我对伪类和伪元素的理解。先介绍一下伪类和伪元素有什么区别?其实这是个纯...

什么是二倍图?什么是三倍图?

什么是二倍图?什么是三倍图?

啥是二倍图和三倍图什么时候会需要比如你需要一个30pt*30pt的图标,那么这时你就需要跟美工(美术工程师)要三个文件: 一个是30px*30px的PNG图片,用原名来命名即可,例如sample.png。 一个是60px*60px的PNG图片,这个要用原名@2x来命名,例如sam...

浮动的影响及如何清除浮动带来的影响

浮动的影响及如何清除浮动带来的影响

什么叫浮动:浮动会使当前标签脱离文档流,产生上浮的效果,同时还会影响周边元素(前后标签)及父级元素的位置和width,height属性。下面用一个小例子来看一看浮动的全过程:1.首先我们新建一个网页,在网页中用div元素创建三个小的正方形,为了区别分别给他们不同的ID值和背景颜色,代码如下<s...

六种实现元素水平居中

六种实现元素水平居中

居中效果在CSS中很是普通的效果,平时大家所看到的居中效果主要分为三大类:水平居中、垂直居中和水平垂直居中。而其中水平居中相对于后两者来说要简单得多。早期总结了一下互联网上有关于水平垂直居中的几种实现方案,比如说《CSS制作水平垂直居中对齐》中介绍了八中实现水平垂直的方案,而在《CSS制作图片水平垂...

CSS如何清除浮动流的多种方案

CSS如何清除浮动流的多种方案

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Document</title></head><style>.wrapper{...

css实现两边有缺口的卡券效果

css实现两边有缺口的卡券效果

自己项目用到优惠券的样式,特拿来分享。主要用到了css的position:absolute属性。 效果如下图:  <!DOCTYPEhtml><htmllang="zh-cn"><head><metacharset="UTF-8...

css模型之层模型

css模型之层模型

css层模型说的是position这个属性,它有四个常用值,分别是static、relative、absolute、fixed。1.static:这个是元素的默认值,特点是页面会依照自左向右、自上向下的方向布局,并且设置top、right、bottom、left值是没有用的,并且设置z-index也...

css中使input输入框与img(图片)在同一行居中对齐

css中使input输入框与img(图片)在同一行居中对齐

display:inline;...

CSS在超出宽度后显示省略号…代码

CSS在超出宽度后显示省略号…代码

display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;必须要有个宽度...

实现div里的img图片水平垂直居中

实现div里的img图片水平垂直居中

body结构<body><div><imgsrc="1.jpg"</div></body>方法一: 将display设置成table-cell,然后水平居中设置text-align为center,垂直居中设置vertical-align...

html怎样设置鼠标指针样式

html怎样设置鼠标指针样式

可以用css来统一设置,也可以单独对标签进行设置。Auto<span>Auto</span>Crosshair<span>Crosshair</span>Default<span>Default</span>Pointer<...

div中p标签自动换行

div中p标签自动换行

只需要设置div的width属性,p标签加上word-break:break-word属性就会自动换行----------------2016.7.1--------------------今天在评论列表中也遇到了这个问题,并且只有英文会出现顶开容器的现象,仔细找了一下资料,因为在排版上,CJK(C...