css颜色

CSS兼容性技巧整理--从IE6-IE9 火狐谷歌浏览器兼容

别来无恙 提交于 2019-12-05 13:59:43
CSS兼容性技巧整理--从IE6-IE9 火狐谷歌浏览器兼容 本文收集整理了IE7,6与Fireofx的CSS兼容性处理技巧,供大家参考。   CSS兼容常用技巧   请尽量用xhtml格式写代码,而且DOCTYPE影响 CSS 处理,作为W3C标准,一定要加DOCTYPE声明。    1.div的垂直居中问题   vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了。缺点是要控制内容不要换行    2. margin加倍的问题   设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。解决方案是在这个div里面加上display:inline;   例如:   <#div id=”imfloat”>   相应的css为   #imfloat{   float:left;   margin:5px;   display:inline;}    3.浮动ie产生的双倍距离   #box{ float:left; width:100px; margin:0 0 0 100px; //这种情况之下IE会产生200px的距离 display:inline; //使浮动忽略}   这里细说一下block与inline两个元素:block元素的特点是,总是在新行上开始

常用的css属性

☆樱花仙子☆ 提交于 2019-12-05 11:25:48
1. color颜色 属性值:颜色单词 比如: color: red ; 2. 字体大小 font-size:12px; 属性值是数字,不要带小数; px 是像素单位 3. 字体系列、字形 font-family 属性值 "微型雅黑" 4. 字体样式 font-style 标准字体:normal 斜体:itelic 5. 字体的粗细 font-weight 属性值 :normal==400 400以上是加粗,以下是变细 6. 将字母变成大小写 font-variant 属性值: normal默认值,small-caps转变成大写 来源: https://www.cnblogs.com/xwzs/p/11922389.html

CSS 基础

我的未来我决定 提交于 2019-12-05 07:41:00
CSS 介绍 CSS ( C ascading S tyle S heet ,层叠样式表 ) 定义 如何显示 HTML 元素。 当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化(渲染) CSS语法 CSS实例 每个 CSS 样式由两个组成部分:选择器和声明。 声明又包括属性和属性值。每个声明之后用分号结束。 CSS注释 /*这是注释*/ CSS的几种引入方式 行内式 是在标记的 style 属性中设定 CSS 样式。不推荐大规模使用。 <p style="color: red">Hello world.</p> 内部样式 嵌入式是将 CSS 样式集中写在网页的 <head></head> 标签对的 <style></style> 标签对中。格式如下: <head> <meta charset="UTF-8"> <title>Title</title> <style> p{ background-color: #2b99ff; } </style> </head> 外部样式 外部样式就是将 css 写在一个单独的文件中,然后在页面进行引入即可。推荐使用此方式。 <link href="mystyle.css" rel="stylesheet" type="text/css"/> CSS选择器 基本选择器 元素选择器 p {color: "red";} ID选择器 #i1

CSS基础

余生颓废 提交于 2019-12-05 04:47:14
CSS简介:   CSS(cascading style sheets):层叠样式表。   WEB标准中的表现标准语言,表现标准语言在网页中主要对网页信息的显示进行控制,简单说就是如何修饰网页信息的显示样式。   用来修饰XHTML或者XML等样式文件的计算机语言。 CSS语法:      选择符表示要定义样式的对象,可以是元素本身,也可以是一类元素或者制定名称的元素。   属性:属性是指定元素所具有的属性,她是CSS的核心,CSS2共有150多个属性。   属性值:属性值包括法定属性值以及常见的数值加单位,如30px,或者颜色值等。 CSS样式创建:   1、内部样式表: 语法: <style type="text/css"> /*CSS语句*/ </style> 注:使用style标记创建样式时,最好将该标签写在<head></head>标签之间   2、外部样式: <link rel="stylesheet" type="text/css" href="目标文件的路径及文件名全称"> 说明: 使用link元素导入外部样式表时,需要将元素写在文档头部,即<head></head>之间。 rel(relation):用于定义文档关联,表示关联样式表; type:定义文档类型; <style type="text/css"> @import url(目标文件的路径及文件名称);

《浏览器工作原理与实践》<05>渲染流程(上):HTML、CSS和JavaScript,是如何变成页面的?

烈酒焚心 提交于 2019-12-05 04:39:43
在上一篇文章中我们介绍了导航相关的流程,那导航被提交后又会怎么样呢?就进入了渲染阶段。这个阶段很重要,了解其相关流程能让你“看透”页面是如何工作的,有了这些知识,你可以解决一系列相关的问题,比如能熟练使用开发者工具,因为能够理解开发者工具里面大部分项目的含义,能优化页面卡顿问题,使用 JavaScript 优化动画流程,通过优化样式表来防止强制同步布局,等等。 既然它的功能这么强大,那么今天,我们就来好好聊聊 渲染流程 。 为了能更好地理解下文,你可以先结合下图快速抓住 HTML、CSS 和 JavaScript 的含义: 从上图可以看出, HTML 的内容是由标记和文本组成。标记也称为标签,每个标签都有它自己的语意,浏览器会根据标签的语意来正确展示 HTML 内容。比如上面的标签是告诉浏览器在这里的内容需要创建一个新段落,中间的文本就是段落中需要显示的内容。 如果需要改变 HTML 的字体颜色、大小等信息,就需要用到 CSS 。CSS 又称为层叠样式表,是由选择器和属性组成,比如图中的 p 选择器,它会把 HTML 里面标签的内容选择出来,然后再把选择器的属性值应用到标签内容上。选择器里面有个 color 属性,它的值是 red,这是告诉渲染引擎把标签的内容显示为红色。 至于 JavaScript (简称为 JS),使用它可以使网页的内容“动”起来,比如上图中,可以通过

DIV+CSS解决IE6,IE7,IE8,FF兼容问题

假如想象 提交于 2019-12-05 03:43:44
1.IE8下兼容问题,这个最好处理,转化成IE7兼容就可以。在头部加如下一段代码,然后只要在IE7下兼容了,IE8下面也就兼容了: 1. <metahttp-equivmetahttp-equiv="x-ua-compatible"content="IE=7"/> 2. 2.flaot浮动造成IE6下面双倍边距问题,这个最常见,也最好处理,!important解决,比如 margin-left:10px!important;/*IE7,IE8,FF下是10PX*/; margin-left:5px;/*IE6下属性写的是5PX,但在显示出来的是10px 3.清除块display,这个可以解决浮动造成的块,造成块后,当DIV背景填色或填图片的时候,会出现背景断开或差一小块。这种兼容出现的不太多,我做到现在,只遇到过两次,方法是在出现兼容的DIV的CSS中写一个display:block,或其它属性,中文什么意思我不知道,我英语差,但能达到想要的效果,6e"Z+e%|8G#| 4.很多朋友DIV+CSS的时候,会出现,在IE的几个浏览器下都好了,但是在FF出问题了,用!important又会把IE7做的不兼容,很头疼,在想,有没有什么方法只对FF下进行操做,我用过这个方法,感觉得是百试不爽,就是在属性前面加符号如:*、&,¥,#,@,—,+,加过符号的属性只有IE的浏览器才识别

css(1)

ε祈祈猫儿з 提交于 2019-12-05 03:16:34
CSS 一、概述 1、简介   css全称是Cascading Sheets ,层叠样式表,级联样式表,简称样式表。 2、作用   设置HTML网页中的元素样式。 3、CSS和HTML的关系   HTML:负责网页结构的搭建,内容的展示;   CSS:负责网页的修饰; 4、CSS与HTML的属性使用原则   w3c建议我们尽量使用css的方式来取代html的属性   css样式:     1)样式代码高度的重用;     2)提高可维护性; 二、语法规范   1、使用CSS的方法   1.1 内联样式 将CSS的样式定义在HTML标签的style属性中 <any style="样式声明"></any> 样式声明 样式属性:值 组成 多个样式声明之间用分号分隔注意:  1、内联样式使用的非常少(禁止使用);  2、样式冲突的时候内联样式优先级最高;  3、内联样式不能重用;  4、项目中一般很少用,只在学习和测试时用;【例子】 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <p style="color:red;font-size:10px">小白兔</p> <p style="color:pink;font-size:20px">白又白</p> <p style

CSS3新增的属性

邮差的信 提交于 2019-12-05 02:15:50
使用CSS设置网页样式需要创建规则,而这些规则包含两部分:一部分是选择器,用于指定规则应用的元素;另一部分是属性,用于控制这些元素的呈现。因此,如果页面中有一部分需要设置某种颜色或尺寸,那么需要使用正确的选择器瞄准页面中的这部分,并使用正确的属性来相应改变其外观。有关CSS的属性具体可以看: https://www.w3school.com.cn/cssref/index.asp 其中CSS3还新增了一些特性 1.CSS3的模块化方式 CSS演进的一个主要变化就是W3C决定将CSS3分成一系列模块。 随着CSS普及率不断上升,对添加规范的呼声也在增加。除了将许多更新加入庞大的规范之外,更容易和更有效地方法是更新规范里的单个条目。模块就能以更及时、更简便的方式更新CSS,从而能够更灵活、更及时地演进整个规范。 CSS3最重要的几个模块包括:更强大的CSS选择器、高级颜色可选方案、背景及边框模块、多列布局模块、媒体查询模块、使用@font-face指令自定义字体、变形、动画以及过度的高级CSS操控。具体的请大家自行去给出的网站上实践。。。。 来源: https://www.cnblogs.com/yourdid/p/11897102.html

CSS3概述

∥☆過路亽.° 提交于 2019-12-05 01:51:36
CSS3版本是CSS的模块化规范。不同的模块扩展、完善了以往CSS版本的各个方面。例如,CSS3颜色模块解决了色彩校正、透明度等功能;CSS3字体模块增加了文字效果,能调整它们的显示,甚至下载自定义字体。另外,还有一些模块是新添加进来的,如渐变和动画模块。其他一些陈旧的不再使用的功能则被抛弃,或者将被抛弃。不管什么情况,当谈到CSS3时,应认真核对和测试对CSS3 Web站点的支持情况。 1.专属CSS前缀 对于一些Web开发人员,CSS往往与标准和规范相关联。与(X)HTML不同,CSS让浏览器厂商更方便地扩展规范,例如,以连字符“-”或下划线“_”为起始标记的新引入的关键字和特姓名就被认为是供应商特有的拓展。语法是-vendoridentifier-newproperty或_vendoridentifier_newproperty,虽然在实践中,带连字符的名称似乎是唯一在使用的扩展。例如,-moz用作Mozilla功能的前缀时,可以写作-moz-border-radius。常见的前缀如下表所示 另外,还有一些其他专有的CSS前缀,这些前缀或许遵守,或不遵守恰当的前缀机制。例如,支持WAP(无线应用协议)的无线电话可以使用-wap-为前缀的特性,如-wap-accesskey。Microsoft Office的一些应用可能会使用类似mso-的CSS规则,如mso-header

编码规范

那年仲夏 提交于 2019-12-04 23:23:21
黄金定律 不管有多少人共同参与同一项目,一定要确保每一行代码都像是同一个人编写的。 HTML 1.语法 1).用两个空格代表制表符 2).嵌套元素应当缩进一次(两个空格) 3).对于属性的定义,用双引号 4).不在自闭合元素的尾部加斜线 2.HTML5 doctype 在每个html页面第一行添加标准模式的声明,确保在每一个浏览器拥有一致的展现。 <!DOCTYPE html> 3.语言属性 强烈建议为html根元素指定lang属性,从而为文档设置正确的语言。这将有助于语言合成工具确定所应该采用的发音,有助于翻译工具确定其翻译时所应遵守的规则等等。 <html lang='en'> </html> 4.IE兼容模式 IE 支持通过特定的 <meta> 标签来确定绘制当前页面所应该采用的 IE 版本。除非有强烈的特殊需求,否则最好是设置为 edge mode,从而通知 IE 采用其所支持的最新的模式。 <meta http-equiv="X-UA-Compatible" content="IE=Edge"> 5.字符编码 <meta charset="UTF-8"> 6.引入 CSS 和 JavaScript 文件 在引入 CSS 和 JavaScript 文件时一般不需要指定 type 属性 7.实用为王 任何时候都要尽量使用最少的标签并保持最小的复杂度。 8.属性顺序 class