首页> css

remjs解决移动端适配问题

分类:前端开发2018-05-03阅读:(3347)标签:css, 移动开发, js
现在移动设备屏幕尺寸繁多,比如iPhone SE到iPhone Plus,安卓机品类更多。为了用户体验,不同屏幕我们都得去适配。在移动端页面制作,我们一般会把单位px换成rem,然后通过媒体查询,js计算等方式,修改html的字号大小,从而整体修改页面大小,打到适配效果。大屏幕就让文字稍微大点,小屏幕下文字就稍微小点。整体比例上看起来是一致的。对于rem,在W3C官网上是这样描述的:“fon...

IE7下overflow:hidden失效

分类:前端开发2015-11-06阅读:(1891)标签:css
通常情况下,overflow:hidden会裁剪隐藏掉子盒子元素溢出的部分,但是也有可能遇到特殊情况。 在IE7下,当子盒子或子元素有相对定位或绝对定位的样式时候,父盒子的overflow:hidden是无效的。 此bug需要给父盒子添加position或者把子元素纸盒子的定位样式去掉。要么都有定位,要么都没有。

清除浮动闭合浮动的四种方法

分类:前端开发2015-11-04阅读:(2355)标签:css, css3
写网页的时候避免不了要写一些浮动,自然也要做清除浮动的处理,清除浮动目的就是解决父盒子高度为0的为题。常见方法有如下四种。方法一:额外标签法这种方法是在浮动的元素后面添加额外的带有clear:both样式的标签来清除浮动。.C{width:0;display:block;overflow:hidden;clear:both;} <div class="parent"...

常用CSS简写

分类:前端开发2015-09-29阅读:(2037)标签:css, css3
CSS简写就是指将多行的CSS属性简写成一行。CSS简写的最大好处就是能够显著减少CSS文件的大小,优化网站整体性能,更加容易阅读。下面介绍常见的CSS简写规则:font简写的顺序:font-style | font-variant | font-weight | font-size/line-height | font-family,(字体样式,大小写,粗细,字号大小/行高,字体名)。简写...

前端页面有哪三层构成,分别是什么?作用是什么?

分类:前端开发2015-09-25阅读:(2029)标签:css, html
今儿被人问到前端页面有哪三层构成,分别是什么?作用是什么?前端干了那么久,细思极恐,网上查查,一下内容为转载,转载的太多也不知道原创是谁了,就当来自互联网吧。最准确的网页设计思路是把网页分成三个层次,即:结构层、表示层、行为层。网页的结构层(structural layer)由 HTML 或 XHTML 之类的标记语言负责创建。标签,也就是那些出现在尖括号里的单词,对网页内容的语义含义做出了...

图片垂直居中

分类:前端开发2015-06-11阅读:(3000)标签:css
<p>在一些情况下,我们需要将图片在div中垂直居中,可是css只有水平居中,img的属性也没有垂直居中的,怎么解决呢?</p><p>在table中,图片、checkbox等元素都可以水平和垂直居中,如果不用table怎么办?那就用div模拟table了。给div样式设置display:table-cell,让div以table表格显示。but,这个主流浏...

css3过渡效果

分类:前端开发2015-05-28阅读:(4358)标签:css, css3
css3的过渡效果,从一种样式逐渐过渡到另外一种样式:transition。transition 简写属性,用于在一个属性中设置四个过渡属性。例如:transition:width 2s linear 1s; //用两秒的时间以匀速改变宽度,效果在一秒后开始。transition-property 规定应用过渡的 CSS 属性的名称。例如:transition-property:width;...

清除苹果产品iPad、iPhone默认样式

分类:前端开发2014-12-17阅读:(1809)标签:css
<p>在做移动端网页的时候会发现写的input标签样式在ipad,iPhone上面显示得太离谱了。和预期的完全不一样,这是因为苹果产品的浏览器对这些标签有默认的css样式。清除这些默认的样式后,显示效果就和写的CSS预期效果一样了。</p><p>清除iPad、iPhone浏览器上input标签的默认样式:</p>input[type="butt...

Margin外边距重叠效果

分类:前端开发2014-02-14阅读:(1529)标签:css
就是在竖直方向,当两个元素的外边距连在一块时,两者的距离并不是两者margin之和,而是取最大margin为准;对于浮动的元素,外边距不存在重叠效果,也就是说,上下边距为两者的margin之和。

IE6下div高度设置无效解决方法

分类:前端开发2014-02-14阅读:(1696)标签:css
div最小高度在IE6下字体大小的限制,一般字体大小在12-14px之间,那么你设置div高度是10px或以下,则不会显示这个高度,默认还是要显示14px的高度。解决:设置字体大小font-size:0;考虑极端情况,div高度设置为0,则font-size:0;在IE6里边不会显示0的div高度;解决:因为div有内容溢出,overflow:hidden即可。综上最简单有效的方法,用ove...
前端开发