常见CSS

【常见CSS】的更多相关文章

IE6常见CSS解析Bug及hack

IE6常见CSS兼容问题总结 1)图片间隙 A)div中的图片间隙(该bug出现在IE6及更低版本中) 描述:在div中插入图片时,图片会将div下方撑大三像素. hack1:将</div>与<img>写在一行上: hack2:将<img>转为块状元素,给<img>添加声明:display:block; B)dt,li中图片间隙(IE6) hack:将<img>转为块状元素,给<img>添加声明:display:block; img设…

CSS——插入形式基本格式常见css代码

常见css代码无下划线链接字体颜色 + 左边距背景颜色字体.字体颜色.大小文本对齐方式[取代了<center>]…

常见CSS选择器的权重和优先级

一.常见CSS选择器 [元素选择器] 1.通配选择器:*(匹配所有元素) a.效率不高,页面上的标签越多,效率越低,所以页面上最好不要出现这个选择器 2.标签选择器:li(匹配标签为li的元素) a.所有标签都能够当做选择器,比如body.h1.dl.ul.span等等 b.不管这个标签藏的多深,都能够被选择上 c.选择的是所有的,而不是某一个.所以是共性,而不是特性 3.ID选择器:#content(匹配ID属性值等于content的元素) 4.类选择器:.list(匹配class属性包含li…

网站美化常见CSS

伴随网络时代日新月异的发展,用户不仅仅满足于软件系统的功能需求,对软件系统的页面显示效果以及交互模式的要求也逐渐提高.尤其是展示性质的平台页面对于界面美化效果要求更高,有一句话说的好:Html是结构,CSS是装饰,JS是胶水(动态设定CSS).今天我们来介绍一些网站美化常见的CSS样式以及处理手法. 1 基础教程 1.1 基础语法选择器选择器通常为需要改变样式的元素: 1) 元素选择器 :例如:html {color:red;} 说明:将html设置为红色 2) 类选择器:例如:.ul .…

IE6 7下常见CSS兼容性处理

以下是一些比较常见的IE6 7下的兼容性问题. 在当下这个时代,其实我们几乎可以不用再去针对IE6做兼容性的处理,除非你的公司还是诡异的要求你兼容到IE6.但是了解一些常见的兼容性问题还是可以帮助我们提高一些布局上的技巧. 以下内容并不需要背下来,其实只要做到见过,万一某一天真碰到了这样的问题知道在哪里可以查看解决方法就可以了. 另外最重要的一点,我认为布局上的规范与合理是解决兼容性的最佳方案.如果布局规范,层次结构清晰,明确,那么至少在IE7下我们其实都不用做特别多的针对性的兼容处理.如果你的…

常见CSS浏览器兼容性问题与解决方案【转载自http://blog.csdn.net/chuyuqing/article/details/37561313/】

所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况.在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或者登陆我们的系统,都应该是统一的显示效果.所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题. 在学习浏览器兼容性之前,我想把前端开发人员划分为两类: 第一类是精确按照设计图开发的前端开发人员,可以说是精确到1px的,他们很容易就会发现设计图的不足,并且在很少的情况下会碰到浏览器的兼容性问题,而这些问题往往都死浏览器…

常用CSS代码片段常见css bug

1.禁止文字被选中 .unselectable { -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; /* Introduced in IE 10. See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/ */ -ms-user-select: none; user-select: none; } /*整站的话给body这…

常见CSS与HTML使用误区

误区一.多div症 <div class="nav"> <ul> <li><a href="/home/">Home</a></li> <li><a href="/about/">About</a></li> <li><a href="/concact/">Concact<…

常见css垂直自适应布局（css解决方法）

css3的盒模型, css3中添加弹性盒模型,最新弹性盒模型是flex,之前为box <!DOCTYPE html> <html > <head> <title>div + css宽度自适应(液态布局)</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type=&quo…

常见css水平自适应布局

左右布局,左边固定,右边自适应布局 BFC方法解决 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <titl…

常见css的兼容问题

链接的虚线框问题  <a class="noDashedBox" href="#"><img src="http://j5.dfcfw.com/image/201406/20140603152217.png" /></a> /* * a, img, input等标签点击时会带有虚线框 * 去除它 */ .noDashedBox { outline:; blur:expres…

常见CSS注意问题

1. 初始化css 有哪些因为浏览器的品种很多,每个浏览器的默认样式也是不同的,比如<button>标签,在IE浏览器.Firefox浏览器以及Safari浏览器中的样式都是不同的,所以,通过重置button标签的CSS属性,然后再将它统一定义,就可以产生相同的显示效果.最简单的CSS Reset内容寥寥几行就能完成:* { padding: 0; margin: 0; border: 0; }* 匹配的是最低级的匹配所以比较慢* { margin: 0; padding: 0; bor…

常见Css样式

css就是就是会使用文档,css2.0中文手册下载地址:http://download.csdn.net/my <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&q…

常见css兼容问题

链接的虚线框问题  <a class="noDashedBox" href="#"><img src="http://j5.dfcfw.com/image/201406/20140603152217.png" /></a> /* * a, img, input等标签点击时会带有虚线框 * 去除它 */ .noDashedBox { outline:; blr:express…

一些常见css样式加选择器

先来个下拉框: 例: select是下拉框标签 multiple:指多选项 size :显示的选项数量 selected="selected":默认选中 —————————分割线———————— 选择器: .name ——class name #name ———id name .name1 >标签 :表示选择name1中的某一个标签 a:hover{ ——表示鼠标放上去时的样式 textext-decoration:underline ——指鼠标放上去时候有下划线 color-r…

几个常见CSS错误和解决办法

1.IE6下,当float存在时,margin双倍的问题解决方法:加display:inline; 例: #content { float: left; width: 500px; padding: 10px 15px; margin-left: 20px; display:inline; } 2.克服盒子模型的hack 原写法: #main-div{ width: 150px; border: 5px; padding: 20px; } 修正后 #mai…

几种常见css布局

单列布局第一种给定宽度,margin:auto 即可实现 html <div class="header"></div> <div class="content"></div> <div class="footer"></div> css .header { margin: 0 auto; max-width: 960px; height: 100px; backgrou…

前端入门-day2（常见css问题及解答）

写在前面今天是入门前端的day2, 小伙伴们应该已经看了一些HTML的基础和CSS的基础了,是不是遇到了很多关于CSS的问题呢.因为HTML很少有太复杂的问题,所以直接写一篇关于CSS的常见问题及解答啦~ display: none;和visibility:hidden;的区别简单来说: display: none;不会再占据空间,就跟不存在一样. visibility:hidden;则只是将透明度变成0,仍然占据其空间. inline.inline-block.block的区别首先要明确…

.login_top_bg { background-image: url(/pcssc/images/login/login-top-bg.gif); background-repeat: repeat-x;//定义了图像的平铺模式}.body { background-color: #EEF2FB; left: 0px;//left 属性规定元素的左边缘.该属性定义了定位元素左外边距边界与其包含块左边界之间的偏移 top: 0px;//top 属性规定元素的上边缘.该属性定义了定位元素上外边…

常见CSS两栏式布局

代码下载:https://files.cnblogs.com/files/xiandedanteng/TwoColumnLayout.rar 效果展示: 代码: <!DOCTYPE html> <html lang="utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <head> <titl…

IE6常见CSS解析Bug和hack

第一:图片间隙 a:div中的图片间隙: 描述:在div中插入图片时,图片会将div下方撑大3像素 hack1:将<div>和<img>写在一行 hack2:将<img>转为块元素,给<img>添加声明:display:block; hack3:给<div>设置:overflow:hidden b:dt,li中图片间隙 hack:同a中的hack2,hack3方法第二:默认高度描述:在IE6及以下版本中,部分块元素具有默认高度(低于18px高…

常见css属性

div { width: 100px; height: 100px; /* 表示行高 */ line-height: 100px; /* 表示背景颜色 */ background-color: brown; /* 表示字体颜色 */ color: white; /* 表示字体大小 */ font-size: 26px; /* 表示文本排列方式…

DIV+CSS规范命名大全

网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率,具体DIV CSS命名规则CSS命名大全内容篇. 常用DIV+CSS命名大全集合,即CSS命名规则 DIV CSS命名目录命名规则说明重要CSS命名 CSS命名参考表命名技巧我们开发CSS+DIV网页(Xhtml)时候,比较困惑和纠结的事就是CSS命名,特别是新手不知道什么地方该如何命名,怎样命名才是好的方法. 一.命名规则说明: - TOP 1).所有的命名最好都小写 2).属性的…

CSS样式之语法

选择符选择符 {属性1:属性值1;属性2:属性值2} 选择符(selector):指定样式适用的标签,除指定标签外,样式不起作用属性:样式的关键字属性值:描述样式的值: 格式:属性与属性之间使用分号分隔,属性与属性值之间使用冒号分隔选择符任何HTML元素都可以是一个CSS选择符选择符仅仅是指向特别样式的元素如:P {font-size:12pt}当中的选择符是P 分类类选择符 id选择符关联选择符类选择符类选择符—css_choose.html 单一个选择符能有不同的CLA…

如何快速掌握CSS（各种CSS工具）

CSS中的大量属性难以记忆,通过组合多种CSS工具,可以快速学习常见样式,并提高设计效率.这里给大家推荐一些比较好的在线工具,通过所见即所得图形化界面设计样式,直接得到对应的CSS代码.相比臃肿的集成设计环境,使用起来较为简单方便. (1)http://cssmate.com/CSSeditor.html 涵盖各类常见CSS属性的在线CSS编辑器: (2)http://grid.mindplay.dk 进行网页整体布局设计,获取对应CSS代码: (3)http://drawter.com/ 基于…

PHP.9-HTML+CSS（三）-CSS样式

CSS样式 CSS是Cascading Style Sheets的简写,它除了可以轻松设置网页元素的显示位置和格式处,甚至还能产生滤镜,图像淡化,网页淡入淡出的渐变效果.CSS就是要对网页的显示效果实现与Word一样的排版控制一个段落.字体.颜色.背景.边框等. 注:注释/* */里面不能再包含注释 1.CSS的四种设置方式内联样式表:在HTML元素标签中使用style属性内联,在需要相同样式情况下,不适用每个HTML标签都可以加样式,如下: <span style="fon…

div+css命名规范大全

网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率, 我们开发DIV+CSS网页(Xhtml)时候,比较困惑和纠结的事就是CSS命名,特别是新手不知道什么地方该如何命名,怎样命名才是好的方法. 一.命名规则说明: 1).所有的命名最好都小写2).属性的值一定要用双引号("")括起来,且一定要有值如class="divcss5",id="divcss5"3).每个标签都要有开始和结束,且要有正确的层次,…

聊聊一直困扰前端程序员的浏览器兼容-【css】

1.为什么会出现浏览器兼容问题? 由于各大主流浏览器由不同的厂家开发,所用的核心架构和代码也很难重和,这就为各种莫名其妙的Bug(代码错误)提供了温床.再加上各大厂商出于自身利益考虑而设置的种种技术壁垒,让CSS应用起来比想象得要麻烦.浏览器的兼容问题是我们必须去克服的. 2.关于浏览器1)主流浏览器Internet Explorer. Safari.Mozilla Firefox. Google Chrome.Opera.百度.360.搜狗.傲游 2)最早的浏览器 : Mosaic / Net…

前端开发周报: CSS 布局方式方式与JavaScript数据结构和算法

前端开发周报:CSS 布局方式与JavaScript动画库 1.常见 CSS 布局方式详见: 一些常见的 CSS 布局方式梳理,涉及 Flex 布局.Grid 布局.圣杯布局.双飞翼布局等.http://cherryblog.site/common-CSS-layout.html 2.几种 JavaScript 动画库推荐JavaScript 库对设计师和开发人员来说,都是非常有用的工具.它们可以为你的网站添加一些超级强大的功能,给用户带来更好的体验.http://www.tuicool.com…

[转]HTML DIV+CSS 命名规范大全

原文链接常用DIV+CSS命名大全集合,即CSS命名规则我们开发CSS+DIV网页(Xhtml)时候,比较困惑和纠结的事就是CSS命名,特别是新手不知道什么地方该如何命名,怎样命名才是好的方法. 一.命名规则说明 1.所有的命名最好都小写 2.属性的值一定要用双引号("")括起来,且一定要有值如 class="helloweb" , id="helloweb" 3.每个标签都要有开始和结束,且要有正确的层次,排版有规律工整 4.空元素要有结束…