css颜色

HTML 样式- CSS

我只是一个虾纸丫 提交于 2020-01-29 00:52:03
如何使用CSS CSS 是在 HTML 4 开始使用的,是为了更好的渲染HTML元素而引入的. CSS 可以通过以下方式添加到HTML中: 内联样式- 在HTML元素中使用"style" 属性 内部样式表 -在HTML文档头部 <head> 区域使用<style> 元素 来包含CSS 外部引用 - 使用外部 CSS 文件 最好的方式是通过外部引用CSS文件. 在本站的HTML教程中我们使用了内联CSS样式来介绍实例,这是为了简化的例子,也使得你能更容易在线编辑代码并在线运行实例。 你可以通过本站的CSS教程 CSS 教程 学习更多的CSS知识. 内联样式 当特殊的样式需要应用到个别元素时,就可以使用内联样式。 使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。以下实例显示出如何改变段落的颜色和左外边距。 <p style="color:blue;margin-left:20px;">This is a paragraph.</p> 学习更多样式,请访问 CSS 教程 . HTML样式实例 - 背景颜色 背景色属性(background-color)定义一个元素的背景颜色: 实例 < body style = " " > < h2 style = " " > 这是一个标题 </ h2 > < p style = " " > 这是一个段落。 </ p

十分钟入门 Less

醉酒当歌 提交于 2020-01-28 04:49:24
我们都知道写 CSS 代码是有些枯燥无味的,尤其是面对那些成千上万行 CSS 代码的项目。你始终在相同的地方使用相同的规则并且在你的编译器中搜索和替换每次颜色的变化。这需要很多的努力和规则来保持你的 CSS 可维护,但它本不应该这样的。 很幸运,网站开发社区已经解决了这个问题,现在我们拥有诸如 Less , Sass 和 Stylus 之类的预处理器,它们给我们提供了许多优于纯 CSS 的好处。 变量 - 它可以让你更轻松的在整个样式表中定义和更改值(这个功能 CSS 在未来某一天也有可能会实现)。 动态计算值 - CSS 中最近出了一个 cal() , 但它只适合用于长度的计算。 Mixins - 可以让你重用或者组合样式,而且支持传递参数。 函数 - 它为你提供了一些方便的程序去操纵颜色,转换图像等。 使用预处理器的唯一缺点就是,你需要将代码转换为纯 CSS 代码,让它能够在浏览器中工作。 1. Getting Started Less 是用 JavaScript 写的,所以需要额外的 Node.js 或者网页浏览器才能够运行它。你可以在你的网站中引入 less.js ,这样在真正的运行环境下它就可以自动编译,但这个过程非常缓慢,所以不建议这么使用。 推荐的方式是提前编译成 CSS 代码并且将一个正常的发展版本备份在线上。当然还有很多可视化的的程序帮助你编译 less 文件

css文本背景样式

时光总嘲笑我的痴心妄想 提交于 2020-01-28 03:43:04
文本样式 文本类 text-transform:uppercase; 全部变为大写 text-transform:lowercase; 全部变为小写 text-transform:capitalize; 首字母大写 text-transform:none; 表示不显示样式 text-indent:?px; 表示文本缩近 给文字加上倒影 text-shadom:?px ?px ?px; 表示模糊值越大,模糊范围越大(x轴、y轴、模糊值) 文本装饰线 text-decoration:underbine; 对文本产生下划线 text-decoration:overline: 对文本产生上划线 rext-decoration:line-through; 对文本产生贯穿线 对齐方式 text-align; 居中 行高 line-height:?px; 表示行距 词间距 例:word-spacing:?px; 字间距 leter-spacing:?px; 字体类型 font-family:sans-serif; 非衬线 font-family:serif; 衬线 字体类型还可以写汉字,如:font-family:微软雅黑 宋体; 字体风格 font-style:normal; 正常的 font-style:italic; 文本样式为斜体 font-style:oblique; 倾斜的字体

Web—02-轻松理解css

a 夏天 提交于 2020-01-26 23:58:56
CSS基本语法以及页面引用 CSS基本语法 css的定义方法是: 选择器 { 属性:值; 属性:值; 属性:值;} 选择器是将样式和页面元素关联起来的名称,属性是希望设置的样式属性每个属性有一个或多个值。代码示例: /* css注释 ctrl+shift+"/" */ div{ width:100px; height:100px; color:red } CSS页面引入方法 1、外联式:通过link标签,链接到外部样式表到页面中。 <link rel="stylesheet" type="text/css" href="css/main.css">` 2、嵌入式:通过style标签,在网页上创建嵌入的样式表。 <style type="text/css"> div{ width:100px; height:100px; color:red } ...... </style> 3、内联式:通过标签的style属性,在标签上直接写样式。 <div style="width:100px; height:100px; color:red ">......</div> CSS文本设置 常用的应用文本的css样式: color 设置文字的颜色,如: color:red; font-size 设置文字的大小,如:font-size:12px; font-family 设置文字的字体,如:font

怎么把网站设为灰色

假装没事ソ 提交于 2020-01-26 21:23:39
根据国务院文件,5.19-5.21为全国哀悼日,在此期间,全国和各驻外机构下半旗志哀,停止公共娱乐活动,外交部和我国驻外使领馆设立吊唁簿。5月19日14时28分起,全国人民默哀3分钟,届时汽车、火车、舰船鸣笛,防空警报鸣响。 Admin5与很多草根网站都将整站换成素装。并建议中国所有站点更换为素装。 国务院决定5月19日至21日为全国哀悼日 为方便站点哀悼,特提供css滤镜代码,以表哀悼。以下为全站CSS代码。 html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); } 使用方法:这段代码可以变网页为黑白,将代码加到CSS最顶端就可以实现素装。建议全国站长动起来。为在地震中遇难的同胞哀悼。 如果网站没有使用CSS,可以在网页/模板的HTML代码 和 之间插入: */ /*--> */ 有一些站长的网站可能使用这个css 不能生效,是因为网站没有使用最新的网页标准协议 请将网页最头部的 替换为以上代码。 有一些网站FLASH动画的颜色不能被CSS滤镜控制,可以在FLASH代码的和 之间插入: */ /*--> */ 一般的discuz论坛在 你的控制css 文件下修改 /images/header/header.css 这个文件,点源码即可看到 另在哀悼日或遇难的新闻,所有专题和主题

CSS 背景颜色

久未见 提交于 2020-01-26 13:21:31
前景颜色通常是字体的颜色,使用color属性。 背景颜色使用属性backgroud-color。颜色可以使用RGB表示,也可以使用十六进制表示,也可以使用颜色名称表示,还可以使用HSL表示,还可以使用RGBA表示。 示例 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 <!DOCTYPE html> < html lang = "zh" > < head > < meta charset = "UTF-8" > < title >背景颜色</ title > < style > *{ color:#fff; } div{ height:100px; width:200px; padding:16px; } #a{ } #b{ } #c{ } #d{ } #e{ } </ style > </ head > < body > < div id = "a" > rgb(120,45,96) </ div > < div id = "b" > #F7643fe </ div > < div id = "c" > #red </

CSS边框

早过忘川 提交于 2020-01-26 02:08:20
/* div{ width: 600px; height: 600px; background-color: darkseagreen; /* 边框大小 :默认1px*/ /* border-width: 10px; */ /* 边框颜色 : 默认黑色*/ /* border-color: darkviolet; */ /* 边框样式 :不写边框样式,不生效*/ /* border-style: solid; */ /* 复合写法 */ /* border:边框宽度 边框样式 边框颜色 */ /* border: */ /* 10px solid black; */ /* } */ /* div{ width: 600px; height:600px; /* background-color: darkseagreen; */ /* border-top: 300px solid black; border-left:300px solid transparent; border-right: 300px solid transparent; border-bottom: 300px solid transparent; */ /* } */ div{ width: 100px; height: 100px; background-color: blanchedalmond;

css基础属性

落爺英雄遲暮 提交于 2020-01-25 16:34:59
color:设置文本颜色; 属性值:1、表示颜色的英文单词,例如:red、blue、green、pink、purple、cyan等; 2、十六进制表示法:#ff0000; 0、1、2...9、a、b、c...f # ff 00 00 红色 绿色 蓝色 0表示颜色的最低值,f表示颜色的最大值; 3、rgb表示法:color:rgb(0,0,0);取值0-255; 4、rgba表示法:color:rgba(0,0,0,0);前三个值的取值0-255,第四个值的取值0-1; a--alpha font-family:设置字体格式;可以设置多个字体格式,之间用“,”隔开,字体格式用“”包含; font-size:设置字体大小,单位像素(px); font-style:设置字体样式 normal--正常的,没有任何样式; italic--斜体字;只有字体本身有斜体才能倾斜,否则不能倾斜; oblique--倾斜的;可以强行倾斜字体; font-weight:设置字体字重,即字体的粗细; 100-900取整百,700相当于粗体(bold),900相当于更粗(bolder); bold--粗体 bolder--比粗体更粗; lighter--细体; 来源: https://www.cnblogs.com/tangdiying/p/10098511.html

CSS背景说明及连写

房东的猫 提交于 2020-01-25 16:31:05
一、CSS背景说明 CSS 可以添加背景颜色和背景图片,以及来进行图片设置。 1.1 背景图片(image) background-image 属性允许指定一个图片展示在背景中(只有CSS3才可以多背景)可以和 background-color 连用。 如果图片不重复地话,图片覆盖不到地地方都会被背景色填充。 如果有背景图片平铺,则会覆盖背景颜色。 background-image : none | url (url) ; /*none :  无背景图(默认的) url :  使用绝对或相对地址指定背景图像 */ background:url("1.jpg") 0 0 no-repeat, url("2.jpg") 200px 0 no-repeat, url("3.jpg") 400px 201px no-repeat; /*这样写等价于:(若有重叠,后边的覆盖前边的)*/ background-image:url("1.jpg"),url("2.jpg"),url("3.jpg"); background-repeat: no-repeat, no-repeat, no-repeat; background-position: 0 0, 200px 0, 400px 201px; 1.2 背景平铺(repeat) 设置背景图片时,默认把图片在水平和垂直方向平铺以铺满整个元素。

CSS背景属性

假如想象 提交于 2020-01-25 16:30:46
1、 background-color 背景颜色 2、 background-image 背景图片 3、 Background-repeat repeat( 默认 ) | no-repeat | repeat-x | repeat-y 背景平铺 4 、 Background-position left | right | center | top | bottom 背景定位   ★方位值只写一个的时候,另外一个值默认居中   ★写2 个方位值的时候,顺序没有要求。   ★写2 个具体值的时候,第一个值代表水平方向,第二个值代表垂直方向。 5、Background-attachment 背景是否滚动 scroll | fixed <style type="text/css"> .box{ height: 500px; background-color: #999; background-image: url(2.png); background-repeat: no-repeat; background-position: 20px 30px; background-attachment: scroll; } </style> </head> <body> <div class="box">fixed的定位以浏览器出发,scroll以元素div定位</div> </body> 6