CSS新手入门笔记整理:CSS常用属性表

字体样式

属性

属性值

说明

font-family

微软雅黑/苹方

字体类型

font-size

数值

字体大小

font-weight

数值/关键字

字体粗细(字重)

font-style

  • normal(正常(默认值))
  • italic(斜体)
  • oblique(斜体)

字体风格

color

色值

字体颜色

文本样式

属性

属性值

说明

text-indent

数值/2em

首行缩进

text-align

  • left(左对齐(默认值))
  • center(居中对齐)
  • right(右对齐)
  • justify(两端对齐)

水平对齐

text-decoration

  • none(去除所有的划线效果(默认值))
  • underline(下划线)
  • line-through(中划线)
  • overline(顶划线)

文本修饰

text-transform

  • none(无转换 (默认值))
  • uppercase(转换为大写)
  • lowercase(转换为小写)
  • capitalize(只将每个英文单词首字母转换为大写)

大小写转换

line-height

数值

行高

letter-spacing

数值

字间距

word-spacing

数值

词间距(只针对英文单词)

vertical-align

  • top(顶部对齐)
  • middle(中部对齐)
  • baseline(基线对齐)
  • bottom(底部对齐)

垂直对齐


边框样式

属性

属性值

说明

border

  • 宽度值 样式 颜色值

边框的整体样式

border-width

  • 数值

边框的宽度

border-style

  • none(无样式)
  • dashed(虚线)
  • solid(实线)

边框的外观

border-color

  • 颜色名称
  • 色值
  • transparent(透明)

边框的颜色

border-radius

  • 数值

边框圆角

列表样式

属性

属性值

说明

list-style-type

  • none(去除列表项符号)

列表项符号

list-style-image

url(图片路径)

列表项图片


表格样式

属性

属性值

说明

caption-side

  • top(标题在顶部(默认值))
  • bottom(标题在底部)

标题位置

border-collapse

  • separate(边框分开,有空隙(默认值))
  • collapse(边框合并,无空隙)

边框合并

border-spacing

  • 数值

边框间距


图片样式

属性

属性值

说明

width

数值

宽度

height

数值

高度

border

数值

边框

text-align

  • left(左对齐(默认值))
  • center(居中对齐)
  • right(右对齐)

水平对齐

vertical-align

  • top(顶部对齐)
  • middle(中部对齐)
  • baseline(基线对齐)
  • bottom(底部对齐)

垂直对齐

float

left(元素向左浮动)

right(元素向右浮动)

文字环绕方式

背景样式

属性

属性值

说明

background-color

  • 色值

背景颜色

background-image

  • url(图片路径)

背景图片地址

background-repeat

  • repeat(在水平方向和垂直方向上同时平铺)
  • repeat-x(只在水平方向(x轴)上平铺)
  • repeat-y(只在垂直方向(y轴)上平铺)
  • no-repeat(不平铺)

背景图片平铺方式

background-position

  • 像素值/关键字;

背景图片位置

background-attachment

  • scroll(随元素一起滚动)
  • fixed(固定不动)

背景图片固定


超链接样式

属性

说明

a:link0

超链接“未访问”的样式

a:visited

超链接“访问后”的样式

a:hover

鼠标“经过”超链接的样式

a:active

鼠标“单击”超链接时的样式

cursor

鼠标外观


盒子模型

属性

属性值

说明

width

数值

宽度

height

数值

高度

border

数值

边框

margin

数值

外边距

padding

数值

内边距

浮动布局

属性

属性值

说明

float

left

左浮动

right

右浮动

clear

both

清除浮动

定位布局

属性

属性值

说明

position

fixed

固定定位

relative

相对定位

absolute

绝对定位

static

静态定位

溢出声名

属性

属性值

说明

overflow

visible

若内容溢出,则溢出内容可见(默认值)

hidden

若内容溢出,则溢出内容隐藏

scroll

若内容溢出,则显示滚动条

auto

auto 跟 scroll 很相似,不同的是 auto 值在盒子需要的时候会给它一个滚动条

元素类型转换

属性值

说明

display

inline

行内元素

block

块元素

inline-block

行内块元素

table

以表格形式显示,类似于 table 元素

table-row

以表格行形式显示,类似于 tr 元素

table-cell

以表格单元格形式显示,类似于 td 元素

none

隐藏元素


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/225012.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Graylog解决超出ES搜索最大窗口限制问题

今天在查询日志的时候graylog报了一个错: While retrieving data for this widget, the following error(s) occurred: Unable to perform search query: Elasticsearch exception [typeillegal_argument_exception, reasonResult window is too large, from size …

云原生向量计算引擎 PieCloudVector:为大模型提供独特记忆

拓数派大模型数据计算系统(PieDataComputingSystem,缩写:πDataCS)在10月24日程序员节「大模型数据计算系统」2023拓数派年度技术论坛正式发布。πDataCS 以云原生技术重构数据存储和计算,「一份存储,多引擎…

我的NPI项目之Android 安全系列 -- 先认识一下ST33Jxxx

目前接触过的高通平台都没有集成单独的SE,安全运行环境都是高通自家的TEE,又言Trustzone。高通Keystore功能也是依赖TEE来实现的。那么,如果另外集成SE,那么高通的Keystore如何集成?TEE部分要如何配置? 最近…

Ubuntu Shutdown while other user logged on

1. sudo vim /etc/systemd/logind.conf 修改代码KillUserProcessesyes 2. sudo touch /etc/polkit-1/localauthority/50-local.d/multi-user-inhibit-shutdown-restart.pkla 3. 打开修改配置文件 sudo vim /etc/polkit-1/localauthority/50-local.d/multi-user-inhibit-shut…

TrustZone之总线请求

接下来,我们将查看系统中的总线请求者,如下图所示: 系统中的A型处理器具有TrustZone感知,并在每个总线访问中发送正确的安全状态。然而,大多数现代SoC还包含非处理器总线请求者,例如GPU和DMA控制器。 与完成…

MC-30A (32.768 kHz用于汽车应用的晶体单元)

MC-30A 32.768 kHz用于汽车应用的晶体,车规晶振中的热销型号之一。该款石英晶体谐振器,可以在-40 to 85 C的温度内稳定工作,能满足起动振动的要求。同时满足AEC-Q200无源元件质量标准认证,满足汽车仪表系统的所有要求。 频率范围…

蓝桥杯专题-真题版含答案-【基因牛的繁殖】【黄金分割数】【振兴中华】【圆周率与级数】

Unity3D特效百例案例项目实战源码Android-Unity实战问题汇总游戏脚本-辅助自动化Android控件全解手册再战Android系列Scratch编程案例软考全系列Unity3D学习专栏蓝桥系列ChatGPT和AIGC 👉关于作者 专注于Android/Unity和各种游戏开发技巧,以及各种资源分…

特斯拉第二代机器人:市场期待与看解

随着特斯拉在人工智能领域的不断突破,其研发的第二代机器人即将面世。这款机器人集结了特斯拉在机器人技术、人工智能和自动驾驶等方面的最新成果,引发了市场和业界的广泛关注。本文将探讨市场对特斯拉第二代机器人的期待与看法。 一、期待:…

Apache Flume(4):日志文件监控

1 案例说明 企业中应用程序部署后会将日志写入到文件中,可以使用Flume从各个日志文件将日志收集到日志中心以便于查找和分析。 2 使用Exec Soucre Exec Source Exec Source通过指定命令监控文件的变化,加粗属性为必须设置的。 属性名默认值说明chan…

ida脚本环境开发配置idapythonidacpp三端环境(win,mac,linux)

ida脚本也有一段时间了,一直有个痛点是找不到比较好的方法热重载脚本来实时改动生效,导致开发效率老慢了。固总结下比较友好的环境搭配 使用ida热加载插件让你开发脚本更高效 github地址: GitHub - 0xeb/ida-qscripts: An IDA plugin to increase productivity when developi…

什么是PHP中的命名空间冲突?

在PHP中,命名空间冲突指的是在程序中存在两个或多个命名空间(namespace)下的类、函数、常量等标识符具有相同的名称,从而导致命名空间冲突的情况。这可能会引发以下问题: 类名、函数名或常量名的冲突: 如果…

【Python】json.dumps()函数详解和示例

json.dumps() 是 Python 中 json 模块的一个函数,用于将 Python 对象编码为 JSON 格式的字符串。这个函数非常有用,当你需要将 Python 对象保存为 JSON 文件,或者通过网络传输到另一个系统时,它可以很方便地将 Python 数据结构转换…

Error: Required request body is missing:……

错误的原因:后端的一个get请求在参数前加了Requestbody注解导致的。 可能很多小伙伴在编写后端脚本后都会用postman去测试接口的正确性。但是上述的问题在postman中根本测试不出来,因为postman工具支持上述的操作。 所以还是建议大家多多在浏览器中进行…

来聊聊CAS

什么是CAS CAS全称Compare-And-Swap,是一种无锁编程算法,即比较当前的值与旧值是否相等若相等则进行修改操作(乐观锁机制),该类常用于多线程共享变量的修改操作。而其底层实现也是基于硬件平台的汇编指令,JVM只是封装其调用仅此而…

探秘npm:解锁前端生态的魔法工具

在当今的软件开发世界中,前端技术以其快速发展和不断创新的特点吸引了无数开发者的关注。然而,随着前端项目越来越庞大和复杂,如何高效地管理和共享代码成为了一个紧迫的问题。在这个领域中,npm(Node Package Manager&…

【Spark精讲】Spark与MapReduce对比

目录 对比总结 MapReduce流程 ​编辑 MapTask流程 ReduceTask流程 MapReduce原理 阶段划分 Map shuffle Partition Collector Sort Spill Merge Reduce shuffle Copy Merge Sort 对比总结 Map端读取文件:都是需要通过split概念来进行逻辑切片&…

【嵌入式面试】嵌入式经典面试题汇总(C语言)

一、预处理器 1、用预处理指令#define 声明一个常数,用以表明1年中有多少秒(忽略闰年问题) #define SECONDS_PER_YEAR (365*24*60*60)UL在这个例子中,SECONDS_PER_YEAR是一个宏常量,它的值被计算为365乘以24乘以60乘以…

CVE-2023-50164 Apache Struts2漏洞复现

CVE-2023-50164 简介: 从本质上讲,该漏洞允许攻击者利用 Apache Struts 文件上传系统中的缺陷。它允许他们操纵文件上传参数并执行路径遍历。这种利用可能会导致在服务器上执行任意代码,从而导致各种后果,例如未经授权的数据访问…

DS冲刺整理做题定理(四)查找与排序

最后一期更新,考试之前应该不会再出该专题了,之后有时间会出一些有关链表的代码题,其他章节只挑选重点的总结~ 一.查找 1.顺序查找 又被称为线性查找,对顺序表和链表都使用~基本思想是从某一端开始,逐个检查关键字是否…

GZ015 机器人系统集成应用技术样题1-学生赛

2023年全国职业院校技能大赛 高职组“机器人系统集成应用技术”赛项 竞赛任务书(学生赛) 样题1 选手须知: 本任务书共 25页,如出现任务书缺页、字迹不清等问题,请及时向裁判示意,并进行任务书的更换。参赛队…