css颜色 | 易学教程

CSS样式表

阅读更多关于 CSS样式表

样式表: CSS 一般称是层叠式样式表平常看到的 <div class=""></div> 或者<div style=""></div> 那是样式表的位置位置不一样我们一看到style 就知道是一个样式表。样式表的位置：内联写在标签里面，例如< div style="元素属性"></div> 内嵌写在head里面外部另外单独新建一个css文件，后缀名.css 作用：决定了页面有哪些样式，例如内容字体的大小颜色位置等等一些样式，决定了页面什么样子，排列的什么样。所以html决定的内容，css决定样子，javascript决定细节。内联：{ 写在标签里面 style="样式属性" 控制精确，但是重用性差优先级最高 } 内嵌：{ 嵌在页面head里面 <style type="text/css"> .div{样式属性} </style> 控制没有内联精确，代码重用性好优先级第二高 } 外部：{ 单独创建新文件css文件，后缀名.css 引入HTML文件代码是：<link href="文件名.css" rel="stylesheet"/> （或者把文件拖进HTML文件代码head里面）控制没有内嵌精确，代码重用性最好优先级最低 } .css文件注释是 /* 内容*/ 来源： https://www.cnblogs.com/zhangwei99com

详解用CSS绘制3D旋转立方体

阅读更多关于详解用CSS绘制3D旋转立方体

CSS3D旋转立方体绝对是能充分代表这些年CSS发展新高度的典型案例。从一种只是简单的颜色和尺寸渲染的标记符，CSS现在已经变成了一种能够创造出复杂的、具有艺术感染力的视觉效果的编程语言。动画效果的生成变得非常的简单易行。遗憾的是，目前网上的关于CSS立方体的制作教程都有些复杂，在立方体的基础上混合了其它视觉效果，所以，我决定写这篇文章，只涉及如何创造出基本的CSS立方体的讲解。这篇文章中使用的例子来自于CodePen上Mircea Georgescu的漂亮杰作。观看演示 HTML 这个立方体首先是包裹在一个 div 里： <div> <div> <div>前</div> <div>后</div> <div>上</div> <div>下</div> <div>左</div> <div>右</div> </div> </div> 1 2 3 4 5 6 7 8 9 10 <div> <div> <div> 前 </div> <div> 后 </div> <div> 上 </div> <div> 下 </div> <div> 左 </div> <div> 右 </div> </div> </div> 而立方体的每个面都用一个 div 元素表示。你可以想象出，我们将使用CSS将它们定位到正确的空间位置上。 CSS 我们一步一步的进行讲解。首先要注意的是包裹这个立方体的 div

CSS背景样式设计简单介绍

阅读更多关于 CSS背景样式设计简单介绍

1. 背景颜色 background属性设置了背景颜色，页面的背景颜色色使用在body的选择器中，实例： body { background-color : #b0c4de ; } CSS中，颜色值通常以以下方式定义: 十六进制如："#ff0000" RGB 如：“rgb(255,0,0)” 颜色名称如：“red” 2.背景图像 background-image描述了元素的背景图像默认情况下，背景图像进行平铺重复显示，以覆盖整个元素实体，实例： body { background-image : url(paper.gif) ; } 若是想水平或垂直平铺如果图像只在水平方向平铺 (repeat -y),代码如下： body { background-image : url(paper.gif) ; background-repeat : repeat -x ; } 如果图像只在垂直方向平铺 (repeat -y),代码如下： body { background-image : url(paper.gif) ; background-repeat : repeat -x ; } 若不想平铺 body { background-image : url(paper.gif) ; background-repeat : no-repeat ; } 设置背景图片的位置

CSS面试题整理

阅读更多关于 CSS面试题整理

Css篇： 1.有哪项方式可以对一个DOM设置它的CSS样式？　　外部样式表，引入一个外部css文件内部样式表，将css代码放在 <head> 标签内部内联样式，将css样式直接定义在 HTML 元素内部 2.CSS都有哪些选择器？派生选择器（用HTML标签申明） id选择器（用DOM的ID申明）类选择器（用一个样式类名申明）还有一些扩展选择器。后代选择器（利用空格间隔，比如div .a{ }）群组选择器（利用逗号间隔，比如p,div,#a{ }）　 CSS选择器的优先级是怎么样定义的？用1表示派生选择器的优先级用10表示类选择器的优先级用100标示ID选择器的优先级 div.test1 .span var 优先级 1+10 +10 +1 span#xxx .songs li 优先级1+100 + 10 + 1 #xxx li 优先级 100 +1 3.CSS中可以通过哪些属性定义，使得一个DOM元素不显示在浏览器可视范围内？　　　　最基本的：　　设置display属性为none，或者设置visibility属性为hidden 　　技巧性：　　设置宽高为0，设置透明度为0，设置z-index位置在-1000 4.超链接访问过后hover样式就不出现的问题是什么？如何解决？答案：被点击访问过的超链接样式不在具有hover和active了

SASS用法指南

阅读更多关于 SASS用法指南

http://www.ruanyifeng.com/blog/2012/06/sass.html 学过 CSS 的人都知道，它不是一种编程语言。你可以用它开发网页样式，但是没法用它编程。也就是说，CSS基本上是设计师的工具，不是程序员的工具。在程序员眼里，CSS是一件很麻烦的东西。它没有变量，也没有条件语句，只是一行行单纯的描述，写起来相当费事。很自然地，有人就开始为CSS加入编程元素，这被叫做 "CSS预处理器" （css preprocessor）。它的基本思想是，用一种专门的编程语言，进行网页样式设计，然后再编译成正常的CSS文件。各种"CSS预处理器"之中，我自己最喜欢 SASS ，觉得它有很多优点，打算以后都用它来写CSS。下面是我整理的用法总结，供自己开发时参考，相信对其他人也有用。 ============================================ SASS用法指南作者：阮一峰一、什么是SASS SASS 是一种CSS的开发工具，提供了许多便利的写法，大大节省了设计者的时间，使得CSS的开发，变得简单和可维护。本文总结了SASS的主要用法。我的目标是，有了这篇文章，日常的一般使用就不需要去看官方文档了。二、安装和使用 2.1 安装 SASS是Ruby语言写的，但是两者的语法没有关系。不懂Ruby，照样使用。只是必须先

认识CSS中css背景样式设置

阅读更多关于认识CSS中css背景样式设置

前端之HTML，CSS（五）　　CSS 　　CSS背景　　CSS可以添加背景颜色和背景图片，也可以对图片进行设置。设置的样式有： background-color 背景颜色 background-image 背景图片 background-repeat 是否平铺 background-position 背景位置 background-attachment 背景是固定还是滚动　　 background-color：设置背景颜色，属性值：颜色设置三种方式：red、#f00、rgb(255,0,0)。注意CSS3中使用rgba(R,G,B,A),其中A代表透明度，属性值取值范围为0-1，0为透明，1为不透明。 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>背景颜色-测试</title> 6 <style type="text/css"> 7 body { 8 background-color: red; 9 } 10 </style> 11 </head> 12 <body> 13 <p>背景颜色</p> 14 </body> 15 </html> View Code 　　 backgound-image：设置背景图片，属性值：URL（）添加图片路径，路径设置：绝对路径，相对路径

IcoMoon工具 svg图标转化为字符

阅读更多关于 IcoMoon工具 svg图标转化为字符

1-2.打开 IcoMoon 载入下载好svg图标（如图所示） 3选择选择工具 4.点击成为白色-即为选中状态 5.生成图标文字 6点击下载文件 7.需要使用的文件 fonts文件和style.css 8.编辑html文档给span标签加上css样式里面的class（icon-uniE900）引入css样式 9style.css 和载入字体一样在样式里添加文字的大小颜色但是字体必须是font-family: ‘icomoon’; 当然IcoMoon 里面也有现成的图标，可以直接使用：仅供参考！来源： CSDN 作者：张得武链接： https://blog.csdn.net/zhangfan5211314/article/details/103627850

常用CSS样式属性|CSS样式表

阅读更多关于常用CSS样式属性|CSS样式表

【长度单位】 CSS可使用长度单位单位单位说明范例 pt Point，就像是Word里面的Point一样大小 font-size:10pt px Pixels，依您屏幕分辨率而决定大小 font-size:10px pc Pica，6个Pica是一英吋 font-size:10pc mm 公厘，用过尺...这个设定值完全不会因为其它设定而改变 font-size:10mm cm 公分，不会因为使用者设定而改变 font-size:10cm % 百分比，大部分是指所在位置宽度或者长度百分比 font-size:10% 【颜色表示】 CSS可用颜色表示方式表示方式表示方式说明范例 #rrggbb 可以用Windows色彩选择工具找到 color:#feefc7 rgb(#,#,#) 用数字来表示红色蓝色以及绿色的混合...也可以用Windows色彩选择工具找 color:rgb(135,255,124) rgb(%,%,%) 用百分比来代表红色蓝色以及绿色的强度来混合颜色 color:rgb(70%,35%,41%) 颜色名称用颜色的名称来指定颜色 color:brown 【背景可用值】 CSS可用背景值名称说明可能值范例 background 背景下面的背景设定值皆适用 background:fixed background-attachment

CSS知识点总结[部分]

阅读更多关于 CSS知识点总结[部分]

css是英文Cascading Style Sheets的缩写,称为层叠样式表，用于对页面进行美化。存在方式有三种：元素内联、页面嵌入和外部引入，比较三种方式的优缺点。注释为 /* 注释内容 */ CSS选择器标签选择器 div{ background-color:red; } <div > </div> class选择器 .bd{ background-color:red; } <div class='bd'> </div> id选择器 #idselect{ background-color:red; } <div id='idselect' > </div> 关联选择器(层级选择器) #idselect p{ background-color:red; } <div id='idselect' > <p> </p> </div> 组合选择器(逗号分隔) input,div,p{ background-color:red; } <div>hello world</div> <input type="text"/> <input type="password"/> <p>hello world</p> 属性选择器对选择到的标签再通过属性再进行一次筛选 input[type='text']{ width:100px; height:200px; } <input type=

css之操作属性

阅读更多关于 css之操作属性

1.文本 1.文本颜色：color 颜色属性被用来设置文字的颜色。颜色是通过CSS最经常的指定：十六进制值 - 如: ＃ FF0000 一个RGB值 - 如: RGB(255,0,0) 颜色的名称 - 如: red 2.水平对齐方式 text-align 属性规定元素中的文本的水平对齐方式。 left 把文本排列到左边。默认值：由浏览器决定。 right 把文本排列到右边。 center 把文本排列到中间。 justify 实现两端对齐文本效果。 2.文本其他操作 font-size: 10px; line-height: 200px; 文本行高通俗的讲，文字高度加上文字上下的空白区域的高度 50%:基于字体大小的百分比 vertical-align:－4px 设置元素内容的垂直对齐方式 ,只对行内元素有效，对块级元素无效 text-decoration:none text-decoration 属性用来设置或删除文本的装饰。主要是用来删除链接的下划线 font-family: 'Lucida Bright' font-weight: lighter/bold/border/ font-style: oblique text-indent: 150px; 首行缩进150px letter-spacing: 10px; 字母间距 word-spacing: 20px; 单词间距

订阅 css颜色