CSS
iceboysoft
认真工作,快乐开发~!
展开
-
CSS中margin属性值的含义
定义和用法margin 简写属性在一个声明中设置所有外边距属性。该属性可以有 1 到 4 个值。说明这个简写属性设置一个元素所有外边距的宽度,或者设置各边上外边距的宽度。块级元素的垂直相邻外边距会合并,而行内元素实际上不占上下外边距。行内元素的的左右外边距不会合并。同样地,浮动元素的外边距也不会合并。允许指定负的外边距值,不过使用时要小心。注释:允许使用负值原创 2014-11-21 11:19:54 · 1942 阅读 · 0 评论 -
html引入css文件的名字大小写问题
1。最近发现一个问题,在电脑上引入css文件的名字是不区分大小写的;2.在手机上是区分大小写的,如果名字一样大小写不一样,是不会识别的。要谨记!原创 2015-08-26 10:23:55 · 1184 阅读 · 0 评论 -
CSS伪类before和after的应用
最近看到一些关于伪类的文章和实例,感觉印象不怎么深刻,今天在项目中出现了效果如图在文字两遍各有一条横线.1.页面局部区域布局div->p原创 2015-07-21 18:27:47 · 1489 阅读 · 0 评论 -
文字换行中word-wrap、white-space和word break的区别
之前写过其中的两个,今天补充一下.1、word-wrap:break-word;内容将在边界内换行,仅用于块对象,内联对象要用的话,必须要设定height、width或display:block或position:absolute。2、word-break:break-all;用于处理单词折断。(注意与第一个属性的对比)3、white-space:nowrap;用于处理原创 2015-09-01 17:14:10 · 2853 阅读 · 0 评论 -
CSS3 浏览器私有属性标识和transform
当前web开发中特别火的无疑是html5+css3,当然这些现在已经被广泛的使用,最近看了写资料,写下些自己的代码。首先是css3的兼容标识:(1)、-webkit-代表chrome、safari私有属性(2)、-moz-代表firefox浏览器私有属性(3)、-o-代表o浏览器私有属性(4)、-ms-代表IE浏览器私有属性原创 2014-12-01 23:14:27 · 996 阅读 · 0 评论 -
CSS样式常用的兼容hack写法
虽然现在低版本的浏览器不再推荐使用,但是国内仍然避免不了一大群人在依旧坚持使用。 如IE6.bg{background:#ccc;_background:#bbb;/*兼容ie6的写法*/}此顺序不可乱,正常的写在前面,hack写法在后面;以下是摘抄过来的:(1)方式一 条件注释法只在IE下生效这段文字只在IE浏览器显示原创 2015-09-22 10:57:30 · 1938 阅读 · 0 评论 -
nth-child(n)的IE8兼容问题
写作背景今天有个列表中第一行边框有特殊样式,第二个要求没有,其他的要求有边框经常用:first-child 但是第二个确不是second-child而是用css3的nth-child(n)但是有个兼容问题就查了一下资料,如下说明demo/* standard nth */ul.menu li:nth-child(3){ /* styles for the 3rd原创 2016-01-25 19:52:01 · 9850 阅读 · 0 评论 -
css文字省略号
好久没写blog了,今天突然看到一个省略号的样式,就记一下 display: block; width: 100px; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;其中内容1.元素块计划2.定义宽度3.overf原创 2015-12-22 14:47:32 · 515 阅读 · 0 评论 -
Web前端基础面试题目及答案
前端基本技能有:1 HTML/CSS 2 JavaScript1、什么是盒子模型? 在网页中,一个元素占有空间的大小由几个部分构成,其中包括元素的内容(content),元素的内边距(padding),元素的边框(border),元素的外边距(margin)四个部分。这四个部分占有的空间中,有的部分可以显示相应的内容,而有的部分只用来分隔相邻的区域或区域。4个部分一起构成了cs原创 2016-05-31 22:08:51 · 17395 阅读 · 1 评论 -
HTML+CSS+JAVASCRIPT基础复习题
HTML+CSS1、盒子模型,块级元素和行内元素特性与区别。2、行内块的使用,兼容性解决。3、清除浮动的方式以及各自的优劣。4、文档流的概念、定位的理解以及z-index计算规则&浏览器差异性。5、CSS选择器以及优先级计算。6、常用的CSS hack。7、遇到的兼容性问题与解决方法。8、垂直水平居中的实现方式。9、常用布局的实现(两列布局、三列适应布局,两原创 2016-05-31 22:10:57 · 2327 阅读 · 0 评论 -
css中单位px、em以及rem的区别
px特点1. IE无法调整那些使用px作为单位的字体大小;2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位;3. Firefox能够调整px和em,rem,但是96%以上的中国网民使用IE浏览器(或内核)。 px像素(Pixel)。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。(引自CSS2.0手册)em是原创 2015-08-24 09:54:06 · 536 阅读 · 0 评论 -
android浏览器下a/input等元素获得焦点时高亮边框
目前一个相对完整的‘去除android浏览器下input等元素获得焦点时高亮边框’的解决方案:input:focus{ -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-user-modify:read-write-plaintext-only; }a标签同理原创 2015-07-08 16:36:19 · 1405 阅读 · 0 评论 -
block,inline和inline-block概念和区别
总体概念block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素)。block元素通常被现实为独立的一块,会单独换一行;inline元素则前后不会产生换行,一系列inline元素都在一行内显示,直到该行排满。大体来说HTML元素各有其自身的布局级别(block元素还是inlin转载 2015-07-12 17:11:58 · 444 阅读 · 0 评论 -
label中的复选框与文字的垂直居中
增加vertical-align:middle;样式即可原创 2014-12-24 13:25:54 · 1361 阅读 · 0 评论 -
word-wrap和word-break
word-wrap:css的 word-wrap 属性用来标明是否允许浏览器在单词内进行断句,这是为了防止当一个字符串太长而找不到它的自然断句点时产生溢出现象。word-break:css的 word-break 属性用来标明怎么样进行单词内的断句。区别:word-wrap 强调的是是否允许单词内断句,而word-break强调的则是怎么样来进行单词内的断句。原创 2014-12-29 10:03:01 · 458 阅读 · 0 评论 -
元素分类--块级元素
元素分类--块级元素什么是块级元素?在html中、 、、、 和 就是块级元素。设置display:block就是将元素显示为块级元素。如下代码就是将内联元素a转换为块状元素,从而使a元素具有块状元素特点。a{display:block;}块级元素特点:1、每个块级元素都从新的一行开始,并且其后的元素也另起一行。(真霸道,一个块级元素独占一行)2、元素转载 2015-01-04 17:04:14 · 699 阅读 · 0 评论 -
css元素分类
在讲解CSS布局之前,我们需要提前知道一些知识,在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素、内联元素(又叫行内元素)和内联块状元素。常用的块状元素有:、、...、、、、、、 、常用的内联元素有:、、、、、、、、、、常用的内联块状元素有:、原创 2015-01-04 17:01:05 · 533 阅读 · 0 评论 -
元素分类--内联块状元素
元素分类--内联块状元素内联块状元素(inline-block)就是同时具备内联元素、块状元素的特点,代码display:inline-block就是将元素设置为内联块状元素。(css2.1新增),、标签就是这种内联块状标签。inline-block元素特点:1、和其他元素都在一行上;2、元素的高度、宽度、行高以及顶和底边距都可设置。提示:下一小节是转载 2015-01-04 17:06:46 · 561 阅读 · 0 评论 -
元素分类--内联元素
元素分类--内联元素在html中,、、、、 、 和就是典型的内联元素(行内元素)(inline)元素。当然块状元素也可以通过代码display:inline将元素设置为内联元素。如下代码就是将块状元素div转换为内联元素,从页使用div元素具有内联元素特点。内联元素特点:1、和其他元素都在一行上;2、元素的高度、宽度、行高及顶部和底部边距不可设置;转载 2015-01-04 17:06:20 · 519 阅读 · 0 评论 -
如需定义元素内容与边框间的空间,可使用 padding 属性,并可使用负值?
请判断以下说法是否正确:如需定义元素内容与边框间的空间,可使用 padding 属性,并可使用负值?正确答案:错误例题解释:定义和用法padding 简写属性在一个声明中设置所有内边距属性。说明这个简写属性设置元素所有内边距的宽度,或者设置各边上内边距的宽度。行内非替换元素上设置的内边距不会影响行高计算;因此,如果一个元素既有内边距又有背原创 2015-02-12 11:34:08 · 6947 阅读 · 0 评论 -
CSS 背景及铺满当前div的小技巧
CSS 背景属性属性描述background简写属性,作用是将背景属性设置在一个声明中。background-attachment背景图像是否固定或者随着页面的其余部分滚动。background-color设置元素的背景颜色。background-image把图像设置为背景。background-p原创 2015-05-14 17:17:47 · 15861 阅读 · 0 评论 -
CSS3 box-shadow 属性
今天突然看到一个边框出现阴影的效果挺好看的就复习一下box-shadow这个属性,以下摘抄w3school实例向 div 元素添加 box-shadow:div{box-shadow: 10px 10px 5px #888888;}定义和用法box-shadow 属性向框添加一个或多个阴影。提示:请使用 border-image原创 2015-06-24 10:48:55 · 864 阅读 · 0 评论 -
html5页面常用的代码
HTML5页面代码结构原创 2016-10-10 15:45:00 · 12919 阅读 · 1 评论