css颜色

CSS 控制打印样式

由 北城以北 提交于 2019-11-28 06:34:11
CSS 控制打印样式 <link href="/Skin/print.css" rel="stylesheet" type="text/css" media="print" /> 这是导入外部 css 文件的代码，并且导入样式应用在 “ 打印预览模式 ” 下，此代码引用的 print.css 文件在正常浏览网页的情况下是不起作用的，在打印页面的时候才会应用。 link 是 html 标签，导入外部文件。 href 是导入文件的路径。 rel 定义文档与链接的关系 , 取值 “stylesheet” 为一个外部加载的样式表 type 所导入文件的类型 , 取值 “text/css” 是 css 文件。 media 媒体类型，默认为 screen （计算机屏幕）。取值为 “print” 意为打印预览模式 。 可以用如下几种方式定义 print css ： 1. <link rel="stylesheet" href="/Themes/canbeing/style/print.css" type="text/css" media="print" /> 2. @import url("print.css") screen; 3. @media print { body { font-size: 12px; } } 4. <style media="print" >body{font

CSS控制print打印样式

由 强颜欢笑 提交于 2019-11-28 06:33:34
一、添加打印样式 1. 为屏幕显示和打印分别准备一个css文件，如下所示： 用于屏幕显示的css： <link rel="stylesheet" href="css/mainstylesheet.css" media="screen" /> 用于打印的css：<link rel="stylesheet" href="css/printstylesheet.css" media="print" /> 2. import方式： <style type="text/css"> @import url("css/printstylesheet.css") print; </style> 3. 直接把屏幕显示样式和打印样式写在一个css文件中： @media print {}{ h1 { color: black; } h2 {}{ color: gray; } } @media print里面的内容只对打印出来的内容有效，之外的内容就是屏幕显示的样式。 其他： 创建一个不指定媒体类型的样式表通常很有用（或者利用media="all"）。当你准备好定义一些特别用 于打印的规则时，可以只创建一个单独的样式表，使任何在打印时看起来不好的样式都失效。使用这种方法的一个问题是必须确保打印机样式实际上确实覆盖了主样式表。可以使用！important. 二、打印样式注意事项： 1.

CSS控制print打印样式

由 喜夏-厌秋 提交于 2019-11-28 06:33:19
来源：http://blog.csdn.net/pangni/article/details/6224533 一、添加打印样式 1. 为屏幕显示和打印分别准备一个css文件，如下所示： 用于屏幕显示的css： <link rel="stylesheet" href="css/mainstylesheet.css" media="screen" /> 用于打印的css：<link rel="stylesheet" href="css/printstylesheet.css" media="print" /> 2. import方式： <style type="text/css"> @import url("css/printstylesheet.css") print; </style> 3. 直接把屏幕显示样式和打印样式写在一个css文件中： @media print {}{ h1 { color: black; } h2 {}{ color: gray; } } @media print里面的内容只对打印出来的内容有效，之外的内容就是屏幕显示的样式。 其他： 创建一个不指定媒体类型的样式表通常很有用（或者利用media="all"）。当你准备好定义一些特别用 于打印的规则时，可以只创建一个单独的样式表，使任何在打印时看起来不好的样式都失效

CSS文字段落排版常用设置

由 泄露秘密 提交于 2019-11-28 06:30:16
.firstp { /* 文字排版：颜色、字号、字体、粗体、斜体、下划线、删除线 */ color: #666; /*颜色*/ font-size: 30px; /*字号*/ font-family: "宋体"; /*字体*/ font-weight: bold; /*粗体*/ font-style: italic; /*斜体*/ text-decoration: underline; /*下划线 删除线用：line-through*/ /* 段落排版：缩进、行高、文字距离、单词间距、对齐 */ text-indent: 2em; /* 缩进 */ line-height: 1.5em; /* 行高 */ letter-spacing: 5px; /* 中文字距离 || 字母间距 */ word-spacing: 50px; /* 单词间距 */ text-align: center; /* 对齐：居中：center、左对齐：left、右对齐：right */ /* 背景设置：背景色、背景图片、背景平铺模式、背景定位 */ background-color: #333; /* 背景色*/ background-image: url(img/bg.png); /* 背景图片 */ background-repeat: no-repeat; /* 背景平铺模式: 不重复 */

CSS引入方式

由 谁说我不能喝 提交于 2019-11-28 06:03:24
CSS语法： 选择器{ 　　声明 ; 　　声明 ； } 声明 => 属性名 : 属性值 可以放一条或多条声明，而且每条声明用分号隔开，最后一条声明后面的分号可以省略。 CSS引入方式 CSS引入方式有四种：行内式、内嵌式、外链式、导入式。 CSS引入方式 — 行内式 通过style这个标签属性，将css键值对直接写入标签内。 <div style="width:100px;height:100px;background-color:red;color:#000">css引入方式之行内式</div> 语法：写在开始标签里面 打一个空格隔开 style="声明 ; 声明 ; ......" CSS引入方式 — 内嵌式（嵌入式） 使用style标签将css属性名和属性值引入到html页面中，通常style标签放置在head标签中。 为什么css样式要放置在head标签中呢？因为代码从上到下执行，如果先加载结构，那么用户看到的就将是干巴巴的内容，而没有通过美化；而先加载样式后加载结构，就相当于孩子出生就是穿着衣服的。 <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible"

css基础总结

由 邮差的信 提交于 2019-11-28 05:36:13
css作用：控制网页的样式 css语法： 选择符{ 属性1：属性值； 属性2：属性值； 属性3：属性值1 属性值2 属性值3； } css实例： div{ width:300px; height:400px; background:red; } css语法解释： 1、选择符：对标签进行获取 2、所有声明都放在大括号里面，声明和声明之间用分号（“；”）连接 3、声明包括属性及属性值，属性和属性值之间用冒号连接 4、如果一个属性拥有多个属性值，属性值之间用空格隔开 例：border（边框）:10px(像素大小) red（颜色） solid（线的类型）; 注： 所有的css代码，必须放在“css样式表”内！！！ 扩展： css样式表内的注释：/* css的注释 */ css样式表 css样式表： 一、内部样式表： 创建方法：使用style标签创建样式表,然后把样式表最好放在head描述区内 <style type="text/css"(可以省略)> css代码 </style> 二、外部样式表： 创建方法：新建一个.css文件 外部导入方式： 1、<link rel="stylesheet" href="url"> rel="stylesheet" //创建关联性 href="url" //导入的路径 type="text/css" //css文本类型 2、<style> @import

三大特性

由 你。 提交于 2019-11-28 03:56:55
层叠 继承 优先级 是我们学习CSS 必须掌握的三个特性。 CSS层叠性 所谓层叠性是指多种CSS样式的叠加。 是浏览器处理冲突的一个能力,如果一个属性通过两个选择器设置到同一个元素上，那么这个时候一个属性就会将另一个属性层叠掉 比如先给某个标签指定了内部文字颜色为红色，接着又指定了颜色为蓝色，此时出现一个标签指定了相同样式不同值的情况，这就是样式冲突。 一般情况下，如果出现样式冲突，则会按照CSS书写的顺序，以最后的样式为准。 CSS最后的执行口诀： 长江后浪推前浪，前浪死在沙滩上。 CSS继承性 所谓继承性是指书写CSS样式表时，子标签会继承父标签的某些样式，如文本颜色和字号。想要设置一个可继承的属性，只需将它应用于父元素即可。 简单的理解就是： 子承父业。 CSS最后的执行口诀： 龙生龙，凤生凤，老鼠生的孩子会打洞。 注意： 恰当地使用继承可以简化代码，降低CSS样式的复杂性。子元素可以继承父元素的样式（text-，font-，line-这些元素开头的都可以继承，以及color属性） CSS优先级 定义CSS样式时，经常出现两个或更多规则应用在同一元素上，这时就会出现优先级的问题。 在考虑权重时，初学者还需要注意一些特殊的情况，具体如下： 继承样式的权重为0。即在嵌套结构中，不管父元素样式的权重多大，被子元素继承时，他的权重都为0，也就是说子元素定义的样式会覆盖继承来的样式。

改变某个对象的CSS样式时，不要使用JS直接添加样式，

由 只谈情不闲聊 提交于 2019-11-28 03:56:30
重绘： 使用js改变网页的背景颜色 浏览器会把整个网页的颜色重新在画一遍，导致性能降低 回流： 只要改变某个DOM对象的宽或者高，浏览器就会重新再计算网页结构，重新生成一次，导致性能严重降低。 CSS样式的性能比JS性能更高，所以能使用CSS的就不要使用JS控制。 修改样式有三种方式： 1，直接在CSS中修改样式，比如hover: .dropdown-active 是父元素 .dropdown-active, .dropdown-active:hover { background: #fff; } .dropdown-active .dropdown-toggle, .dropdown-active:hover .dropdown-toggle { border-left: 1px solid #cdd0d4; border-right: 1px solid #cdd0d4; } .dropdown-active .dropdown-layer, .dropdown-active:hover .dropdown-layer { display: block; } 2，使用JS添加一个类名 .dropdown-active $('.dropdown').hover(function() { $(this).addClass('dropdown-active'); },

css背景

由 自古美人都是妖i 提交于 2019-11-28 03:55:58
CSS 背景(background) CSS 可以添加背景颜色和背景图片，以及来进行图片设置。 background-color 背景颜色 background-image 背景图片地址 background-repeat 是否平铺 background-position 背景位置 background-attachment 背景固定还是滚动 背景的合写（复合属性） background:背景颜色 背景图片地址 背景平铺 背景滚动 背景位置 背景图片(image) 语法： background-image : none | url (url) 参数： none : 　无背景图（默认的） url : 　使用绝对或相对地址指定背景图像 background-image 属性允许指定一个图片展示在背景中（只有CSS3才可以多背景）可以和 background-color 连用。 如果图片不重复地话，图片覆盖不到地地方都会被背景色填充。 如果有背景图片平铺，则会覆盖背景颜色。 小技巧： 我们提倡 背景图片后面的地址，url不要加引号。 背景平铺（repeat） 语法： background-repeat : repeat | no-repeat | repeat-x | repeat-y 参数： repeat : 　背景图像在纵向和横向上平铺（默认的） no-repeat :

背景渐变

由 强颜欢笑 提交于 2019-11-28 03:54:35
以前，我们要实现这种渐变，可能要用 Photoshop 或 Fireworks 创建一个渐变图形，然后使用 background-image 属性把渐变图形放在元素的背景中。 现在，CSS支持渐变背景，可以理解为Web浏览器即时创建的图像。所以，渐变也使用常规的 background-image 属性创建 线性渐变 background-image: linear-gradient( 角度 , 颜色); 线性渐变是最基本的渐变类型。这种渐变在一条直线上从一个颜色过渡到另一个颜色。 微信订阅号：Rabbit_svip 这条直线的方向由角度指定，或者在关键字 to 后面加上 top、bottom、right、left 中的某一个关键字或多个关键字，例如 to bottom left。 如上图例子 CSS代码： body { background-image: linear-gradient(to right , #7A88FF, #7AFFAF); } 如果渐变是从元素上边的紫色过度到下边的绿色，要使用 to bottom 关键字。 CSS代码： html, body { width: 100%; height: 100%; } body { background-image: linear-gradient(to bottom , #7A88FF, #7AFFAF); } 另外
订阅 css颜色