007 样式与长度颜色

样式与长度颜色

1、基本样式

<head>
    <style>
        div {
            width: 100px;
            height: 100px;
            background-color: red;
        }
    </style>
</head>

2、长度

  • px:像素(pixel),屏幕上显示的最小单位,用于网页设计,直观方便
  • mm:毫米
  • cm:厘米
  • in:英寸
  • pt:点(point),一个标准的长度单位,1pt=1/72in,用于印刷业,非常简单易用;
  • em:相当长度,通常1em=16px,应用于流式布局

3、颜色

  • rgb():三个值可为[0-255]数值或百分比,以,相隔(r:Red g:Green b:Blue)
  • rgba():前三个值可为像素或是百分比,最后一个为[0, 1]数值,以,相隔(r:Red g:Green b:Blue a:Alpha)
  • hsl():第一个值为[0,360]数值,后二个值可为百分比,以,相隔(h:Hue s:Saturation l:Lightness)
  • hsla():第一个值为[0,360]数值,中间二个值可为百分比,最后一个为[0, 1]数值,以,相隔(h:Hue s:Saturation l:Lightness a:Alpha)
  • AABBCC:六个十六进制位,每两位一整体,分别代表Red、Green、Blue,可以简写#abc

v_test:熟悉所有的长度单位与颜色表示方式

原文地址:https://www.cnblogs.com/hades0607/p/9682511.html

时间: 2024-10-22 16:24:44

007 样式与长度颜色的相关文章

DAY44-前端入门-css的三种引用方式以及优先级、样式与长度颜色、常用样式、css选择器

目录 一.css的三种引用方式 行间式 内联式 外联式 二.三种引入的优先级 三.样式与长度颜色 基本样式 长度 颜色 四.常用样式 字体样式 文本样式 背景样式 五.css选择器 基础选择器 基础选择器优先级 组合选择器 组合选择器优先级 属性选择器 一.css的三种引用方式 行间式 1.在标签头部的style 2.属性值是css语法 3.属性值用Key:value形式赋值,value具有单位 4.属性值之间用;隔开 <div style='width:100px;height=100px;b

样式与长度颜色

样式与长度颜色 1.基本样式 <head>    <style>        div {            width: 100px;            height: 100px;            background-color: red;       }    </style></head> 2.长度 px:像素(pixel),屏幕上显示的最小单位,用于网页设计,直观方便 mm:毫米 cm:厘米 in:英寸 pt:点(point),一个

WPF自定义Button样式(按钮长度随Content长度自适应)

代码如下: 1 <Style x:Key="ButtonStyle" TargetType="Button"> 2 <Setter Property="Template"> 3 <Setter.Value> 4 <ControlTemplate TargetType="Button"> 5 <!--StackPanel是用来控制当Button长度变化时,位置的适应-->

Bootstrap3基础 bg-danger/info... 辅助类样式 背景文本颜色

? 内容 参数 ??OS ??Windows 10 x64 ??browser ??Firefox 65.0.2 ??framework?? ??Bootstrap 3.3.7 ??editor ??Visual Studio Code 1.32.1?? ??typesetting ??Markdown ? code <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="U

Bootstrap3基础 text-muted/success... 辅助类样式 情景文本颜色

? 内容 参数 ??OS ??Windows 10 x64 ??browser ??Firefox 65.0.2 ??framework?? ??Bootstrap 3.3.7 ??editor ??Visual Studio Code 1.32.1?? ??typesetting ??Markdown ? code <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="U

去掉el-table表格的默认样式,表头颜色,hover的效果

!important不起作用,     scoped  和/deep/使用  在需要改的地方的前边一定要加上  .el-table <style  scoped> /deep/ .el-table th{ background-color: white ; } /* 表尾 */ /deep/ .el-table .el-table__footer-wrapper tbody td { background-color: white; } /* 表头 */ /deep/  .el-table__

长度与颜色单位

样式与长度颜色 1.基本样式 <head> <style> div { width: 100px; height: 100px; background-color: red; } </style> </head> 2.长度 px:像素(pixel),屏幕上显示的最小单位,用于网页设计,直观方便 mm:毫米 cm:厘米 in:英寸 pt:点(point),一个标准的长度单位,1pt=1/72in,用于印刷业,非常简单易用: em:相当长度,通常1em=16px

前端HTML、css、javascript学习

一.html.css.javascript基本认识 1.HTML 类型:超文本标记语言 用途:可用于网页结构的设计或搭建: 后缀:html.html 超文本简述:'超文本'就是指的是其可以包含图片.链接.音乐.程序等非文字元素 HTML简述如下: 1.标记语言:标记语言为非编程语言,不具备编程语言的程序逻辑 2.HTML组成部分:由标签.指令.转义字符(实体) 指令:被尖括号包裹有!开头的标记 转义字符:被&与:包裹的特殊字母组合或#开头的十进制数.(空格&nbsp,版权&copy

html5标签css3的常用样式

<meta name=''> name:有如下6个值:application-name:文档名或者应用名,整个文档只能包含一个值.author:文档作者description:文档描述generator:生成文档的程序.keywords:网页关键字,用英文逗号分隔. <a href="http://www.baidu.com">百度一下</a> href:路径 <img src="../img/a.jpg" alt=&quo