CSS属性图

01文字属性

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>文字属性</title>

<style>

p{

font-style: italic;

font-weight: bold;

font-size: 10px;

font-family:"楷体";

}

</style>

</head>

<body>

<!--

02字体属性补充

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>字体属性补充</title>

<style>

p{

/*

被注释掉的内容

*/

/*font-family:"乱七八糟的字体", "微软雅黑";*/

/*font-family: Arial, "微软雅黑";*/

font-family:"Microsoft YaHei";

}

</style>

</head>

<body>

03-文字属性的缩写

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>文字属性的缩写</title>

<style>

p{

/*

font-style: italic;

font-weight: bold;

font-size: 10px;

font-family:"楷体";

*/

font:bold italic 10px "楷体";

}

</style>

</head>

<body>

<!--

04-文本属性

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>文本属性</title>

<style>

p{

text-decoration: none;

text-align: left;

text-indent: 2em;

}

a{

text-decoration: none;

}

</style>

</head>

<body>

<!--

05-颜色属性

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>颜色属性</title>

<style>

p{

/*color: red;*/

/*color: rgb(255,0,0);*/

/*color: rgba(255,0,0,1);*/

color: #FF0000;

color: #F00;

/*color: rgba(255,0,0,0.2);*/

color: #ffee00;

color: #fe0;

color: #769abb;

}

</style>

</head>

<body>

<!--

关注微信公众号

更多好内容

如果你觉得我的文章对你有帮助,请支持我,你的支持是我最大的动力

CSS的各种重要属性的更多相关文章

  1. css的五种属性值----在路上（21）

    在CSS中,每个属性的属性值都有一定的范围,并且不同类型的属性值有不同的值.对于一个属性,必须取得正确的属性值,才能被浏览器正确地解释,因此一定要弄清每种类型的属性值范围.在CSS中属性一般有以下几种 ...

  2. 脚本化CSS类-HTML5 classList属性

    HTML元素可以有多个CSS类名,class属性保存了一个用空格隔开的类名列表.标识符class在JavaScript中是保留字,所以在JavaScript中可以用className. //如下代码设 ...

  3. CSS 中关于background 属性功能

    background 是 css中的核心属性,我们对他应该充分了解. background-image   定义背景图像  这个属性是我们用的最多的属性 设置背景图像有两个方式 background: ...

  4. Css中的Position属性

    Css中的Position属性 Css属性在线查询地址: http://www.css88.com/book/css/properties/index.htm CSS 中的 position 属性 在 ...

  5. css中background背景属性概

    css中background背景属性概 background:url(背景图片路径)  no-repeat;/*不重复默认在左上方*/background:url(背景图片路径)  no-repeat ...

  6. CSS中的display属性

    CSS中的display属性 display:block是可以把非块级元素强制转换为块级元素显示,如内嵌元素span,原来不支持设置宽高,宽度是由内容撑开的,几个span元素是在同一行内的,如果给sp ...

  7. 举例详解CSS中的cursor属性

    这篇文章主要举例介绍了CSS中的cursor属性,包括zoom-in/zoom-out和grab/grabbing等常用属性值的使用,需要的朋友可以参考下 一.开篇之言 CSS3的领域范围已经渗透到了 ...

  8. 深入理解css中的margin属性

    深入理解css中的margin属性 之前我一直认为margin属性是一个非常简单的属性,但是最近做项目时遇到了一些问题,才发现margin属性还是有一些“坑”的,下面我会介绍margin的基本知识以及 ...

  9. 理解与应用css中的display属性

    理解与应用css中的display属性 display属性是我们在前端开发中常常使用的一个属性,其中,最常见的有: none block inline inline-block inherit 下面, ...

  10. css中的列表属性

    list-style-type设定引导列表的符号类型,可以设置多种符号类型,值为disc.circle.square等 list-style-image使用图像作为定制列表的符号 list-style ...

随机推荐

  1. kafka入门之broker--通信协议

    kafka的通讯协议是基于tcp之上的二进制协议,所有类型的请求和响应都是结构化的,由不同的初始类型构成.kafka使用这组协议完成各个功能的实现. 单个kafka client通常需要同时连接多个b ...

  2. mininet + opendaylight环境配置

    环境配置 ubuntu18.04 镜像 mininet2.2.2 apt-get install mininet 但这种安装只是TLS版本的mininet,与最新版本在功能上有所差距. 控制器(ope ...

  3. 一条 sql 的执行过程详解

    写操作执行过程 如果这条sql是写操作(insert.update.delete),那么大致的过程如下,其中引擎层是属于 InnoDB 存储引擎的,因为InnoDB 是默认的存储引擎,也是主流的,所以 ...

  4. 冰河教你一次性成功安装K8S集群（基于一主两从模式）

    写在前面 研究K8S有一段时间了,最开始学习K8S时,根据网上的教程安装K8S环境总是报错.所以,我就改变了学习策略,先不搞环境搭建了.先通过官网学习了K8S的整体架构,底层原理,又硬啃了一遍K8S源 ...

  5. 本人的CSDN博客

    本人的CSDN博客链接: 传送门

  6. 第7.26节 Python中的@property装饰器定义属性访问方法getter、setter、deleter 详解

    第7.26节 Python中的@property装饰器定义属性访问方法getter.setter.deleter 详解 一.    引言 Python中的装饰器在前面接触过,老猿还没有深入展开介绍装饰 ...

  7. Python正则表达式\W+和\W*匹配过程的深入分析

    在学习re.split函数的处理过程中,发现执行如下语句及返回与老猿预想的不一致: >>> re.split('\W*','Hello,world') ['', 'H', 'e', ...

  8. python socket 聊天室

    socket 发送的时候,使用的是全双工的形式,不是半双工的形式.全双工就是类似于电话,可以一直通信.并且,在发送后,如果又接受数据,那么在这个接受到数据之前,整个过程是不会停止的.会进行堵塞,堵塞就 ...

  9. 冲刺Day7

    每天举行站立式会议照片: 昨天已完成的工作: 1.确认商品分类栏,并前后端交互 2.检查.更正订单模块的代码 3.检查.更正用户模块的代码 今天计划完成的工作: 成员 任务 高嘉淳 检查代码.提供测试 ...

  10. 【NOI2019】弹跳（KDT优化建图）

    Description 平面上有 \(n\) 个点,分布在 \(w \times h\) 的网格上.有 \(m\) 个弹跳装置,由一个六元组描述.第 \(i\) 个装置有参数:\((p_i, t_i, ...