html/css
文艺er
这个作者很懒,什么都没留下…
展开
-
css reset重置基础代码
Eric Meyer html, body, div, span,applet, object, iframe, table, caption, tbody, tfoot, thead, tr,th, td, del, dfn, em, font, img, ins, kbd, q, s, samp, small,strike, strong, sub, sup, tt, var,转载 2014-04-01 10:18:34 · 755 阅读 · 0 评论 -
css实现背景透明文字不透明
设置元素的透明度: -moz-opacity:0.8; /*在Firefox中设置元素透明度 filter: alpha(opacity=80); /*ie使用滤镜设置透明 但是当我们对一个标签设置背景的透明度时,往往我们并不希望该标签上的文字图片也变成半透明了。 例如: <div><p>不透明</p></div> ...原创 2014-08-19 17:41:33 · 470 阅读 · 0 评论 -
如何在IE7下兼容半透明
background:#3598DB; filter:alpha(opacity=60);-moz-opacity:0.6; opacity:0.6; CSS opacity 属性opacity -- 不透明度取值: <alphavalue> | inherit<alphavalue>: 透明度取值(取值范围[0.0,1.0])inheri...原创 2014-08-24 09:51:56 · 213 阅读 · 0 评论 -
css中的大于号是什么意思
css中的">"表明class样式只作用于子级元素,对于子级再往下的元素则忽略不计,比如孙级的元素就会被忽略。比如这样的代码:<div><p><span>数学</span></p><span>语文</span><span>体育</span&原创 2014-09-11 11:25:10 · 2550 阅读 · 0 评论 -
Css Sprite
Css Sprite也被为CSS精灵,这是前端攻城师必备的技能之一,也是衡量初级攻城师和中级攻城师的标准之一。下面大概描述一下Css Sprite的基本概念: 这是一种网页图片应用处理的方法,将一个页面涉及到的一些零散的图片整合到一张图片上,减少客户端对服务器HTTP请求的次数,然后用CSS背景图定位的方法来处理需要用到的图片部分。 话说背景定位,其实就是操纵背景的...原创 2014-09-14 17:43:00 · 149 阅读 · 0 评论 -
JavaScript 下拉菜单实现代码
利用css+js实现的下拉菜单。通过getElementsByTagName获取ul,隐藏显示。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmln...原创 2014-10-12 13:57:11 · 1034 阅读 · 0 评论 -
css之让文字排在图片的右边的中心位置
<dl> <dt>领导、老师</dt> <dd><img src="images/tx1.jpg" width="100" height="100" /><a href="#">zzzzzzzz原创 2014-10-13 10:54:51 · 5556 阅读 · 0 评论 -
select控件option里加链接
1、select控件option里加链接 <select multiple="multiple" onchange="top.location=this.value;" > <option value="http://www.baidu.com" selected>中国</option> <option value=原创 2014-10-19 17:25:45 · 693 阅读 · 0 评论 -
html中怎么去掉input获取焦点时候的边框
css设置属性:outline:none;原创 2014-10-20 17:01:23 · 2435 阅读 · 0 评论 -
css元素隐藏原理及display:none和visibility:hidden
一、CSS元素隐藏 在CSS中,让元素隐藏(指屏幕范围内肉眼不可见)的方法很多,有的占据空间,有的不占据空间;有的可以响应点击,有的不能响应点击。一个一个看。 { display: none; /* 不占据空间,无法点击 */ } /***************************************************************************...原创 2014-10-23 17:13:12 · 229 阅读 · 0 评论 -
em px pt单位介绍及换算
PX\EM\PT单位介绍px Pixel单位名称为像素,相对长度单位,像素(px)是相对于显示器屏幕分辨率而言的国内推荐;em单位名称为相对长度单位。相对于当前对象内文本的字体尺寸,国外使用比较多,这里em与html <em>标签的"EM"拼写完全相同,而这里em作为单独文本单位。pt单位名称为点(Point),绝对长度单位一般老版本的table使用长度大小单位但是现在基本上没有使用。...原创 2014-11-27 16:39:53 · 857 阅读 · 0 评论 -
CSS控制文本自动换行
1.你定死表格的宽度,即给表格一个宽度值(是数值,不是百分比) 2.强制不换行div {//white-space:不换行;normal 默认;nowrap强制在同一行内显示所有文本,直到文本结束或者遭遇 br 对象white-space:nowrap; }自动换行div { word-wrap: break-word;//word-break设置强行换行;normal 亚洲语言和非亚洲语言...2014-04-01 10:37:00 · 325 阅读 · 0 评论 -
css reset重置基础代码
Eric Meyerhtml, body, div, span,applet, object, iframe, table, caption,tbody, tfoot, thead, tr,th, td, del, dfn, em, font, img, ins,kbd, q, s, samp, small,strike, strong, sub, sup, tt, var,...2014-04-01 10:18:00 · 142 阅读 · 0 评论 -
CSS实现透明效果颜色的方法:RGBa
RGBa是一种在CSS中声明包含透明效果的颜色的方法,它的语法是这样的:123div { background: rgba(200, 54, 54, 0.5);}它允许我们为元素添加透明色。或许我们习惯了使用”opacity“,它很简单易用,但是,opacity会使所有的子元素都变成透明的,而且很难去解决这个问题。(除非转载 2014-03-31 20:33:51 · 2565 阅读 · 0 评论 -
CSS控制文本自动换行
1.你定死表格的宽度,即给表格一个宽度值(是数值,不是百分比) 2.强制不换行div{//white-space:不换行;normal 默认;nowrap强制在同一行内显示所有文本,直到文本结束或者遭遇 br 对象white-space:nowrap; }自动换行div{ word-wrap: break-word;//word-break设转载 2014-04-01 10:37:20 · 6319 阅读 · 0 评论 -
CSS命名规范(规则)
常用的CSS命名规则头:header内容:content/container尾:footer导航:nav侧栏:sidebar栏目:column页面外围控制整体佈局宽度:wrapper左右中:left right center登录条:loginbar标志:logo广告:banner页面主体:main热点:hot新闻:news下载:downl转载 2014-04-01 10:42:45 · 588 阅读 · 0 评论 -
css清除浮动大全
我根据自己的经验总结8种清除浮动的方法(测试已通过 ie chrome firefox opera,后面三种方法只做了解就可以了): 1,父级div定义 height .div1{background:#000080;border:1px solid red;/*解决代码*/height:200px;}.div2{background:#800080;bor转载 2014-04-05 21:44:35 · 485 阅读 · 0 评论 -
常用的css命名规则
常用的css命名规则:头:header内容:content/container尾:footer导航:nav侧栏:sidebar栏目:column页面外围控制整体布局宽度:wrapper左右中:left right center登录条:loginbar标志:logo广告:banner页面主体:main热点:hot新闻:news下载:download子导航:subnav菜单:menu子菜单:s转载 2014-06-22 23:56:41 · 384 阅读 · 0 评论 -
常用的css命名规则
常用的css命名规则:头:header内容:content/container尾:footer导航:nav侧栏:sidebar栏目:column页面外围控制整体布局宽度:wrapper左右中:left right center登录条:loginbar标志:logo广告:banner页面主体:main热点:hot新闻:news下载:d...2014-06-22 23:56:00 · 89 阅读 · 0 评论 -
CSS3特性:CSS3 target伪类
CSS3 target伪类是众多实用的CSS3特性中的一个。它用来匹配文档(页面)的URI中某个标志符的目标元素。具体来说,URI中的标志符通常会包含一个”#”字符,然后后面带有一个标志符名称,比如#respond,target就是用来匹配ID为respond的元素的。现在在页面中,点击一个ID链接后,页面只会跳转到相应的位置,但是并不会有比较明显的UI标识,使用:target伪类可以像:h...原创 2014-07-08 15:36:46 · 178 阅读 · 0 评论 -
CSS滤镜让图片模糊(毛玻璃效果)
<img src="mm1.jpg" /><img src="mm1.jpg" class="blur" /> .blur { filter: url(blur.svg#blur); /* FireFox, Chrome, Opera */ -webkit-filter: blur(10px); /* Chrome, Oper...原创 2015-02-03 08:51:46 · 517 阅读 · 0 评论 -
CSS选择器的权重与优先规则
我们在使用CSS对网页元素定义样式时经常会遇到这种情况:要对一般元素应用一般样式,然后在更特殊的元素上覆盖它们。那么我们怎么样来保证我们所新定义的元素样式能覆盖目标元素上原有的样式呢?在CSS中,会根据选择器的特殊性来决定所定义的样式规则的次序,具有更特殊选择器的规则优先于具有一般选择器的规则,如果两个规则的特殊性相同,那么后定义的规则优先。那么,又怎么来计算选择器的特殊性呢?下面这张图...原创 2014-08-10 21:50:06 · 136 阅读 · 0 评论 -
CSS实现透明效果颜色的方法:RGBa
RGBa是一种在CSS中声明包含透明效果的颜色的方法,它的语法是这样的: 123div { background: rgba(200, 54, 54, 0.5);}它允许我们为元素添加透明色。或许我们习惯了使用”opacity“,它很简单易用,但是,opacity会使所有的子元素都变成透明的,而且很难去解决这个问题。(除非使用怪异的定位...2014-03-31 20:33:00 · 913 阅读 · 0 评论 -
HTML head 头标签
HTML head 头部分的标签、元素有很多,涉及到浏览器对网页的渲染,SEO 等等,而各个浏览器内核以及各个国内浏览器厂商都有些自己的标签元素,这就造成了很多差异性。移动互联网时代,head 头部结构,移动端的 meta 元素,显得更为重要。了解每个标签的意义,写出满足自己需求的 head 头标签,是本文的目的。本篇以一丝的文章为基础,进行扩展总结介绍常用的 head 中各个标签、元素的意义以及...原创 2014-12-05 20:13:31 · 235 阅读 · 0 评论