前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >CSS语法小记

CSS语法小记

作者头像
阿豪聊干货
发布2018-08-09 14:57:51
4900
发布2018-08-09 14:57:51
举报
文章被收录于专栏:Java后端技术Java后端技术

一、CSS语法结构

  语法:选择符{属性:值} 例如:body{font-size:12px;}

  参数说明:

    1.选择符(Selector):指明这组样式所要针对的对象。可以是一个XHTML标签,例如h1,img;也可以是定义了特定的id或者class的标签,如:#main表示用                       id="main"修饰的标签,.footer表示用class="footer"修饰的标签等。     2.属性(property):选择符的样式属性,如颜色、大写、定位、浮动方式等。     3.值(value):是指属性的值。     4.同时可以为一个选择符定义多个属性,属性之间用分号";"隔开。     5.尽量使用通用属性,不使用存在兼容性差别的属性。

二、CSS长度单位

单位

说明

相对长度单位

em

相对于当前对象内文本的字体尺寸

px

像素(Pixel)推荐使用

绝对长度单位(基本上用不到)

in

英寸

cm

厘米

mm

毫米

pt

点(point)

三、CSS颜色

颜色单位

说明

十六进制

如:color:#ffffff;

颜色名称

如:color:Red;

三原色单位

如:rgb(255,0,0);

  注意:颜色一般常用的是十六进制,三原色的原理:【红(r)、绿(g)、蓝(b)】混合而成,每个值域在0-255之间。

四、CSS控制字体

功能

语法

设置字号

font-size:12px;

设置字体

font-family:Arial,'宋体';

设置字色

color:#fff;

设置行高

line-height:50px;

设置字体粗细

font-weight:normal(正常) bolder(粗体)

设置字体样式

font-style:normal[正常]、italic[斜体];

修饰文字

text-decoration:none[正常]、underline[下划线]、overline[上划线]、line-through[删除线]

字符间距

letter-spacing:normal[正常]、length[长度单位]

单词间距

word-spacing:normal[正常]、length[长度单位]

文本缩进

text-index:2em 可以为负值

水平对齐方式

text-align:left/center/right

垂直对齐方式

vertical-align:sub[下标]、super[上标]、top[同行最高元素顶部对齐]、middle[同行元素中部对齐]、bottom[同行最低元素底端对齐]

空白处理

white-space:normal[自动换行]、pre[换行和空白受保护]、nowrap[强制在同一行显示]

大小写控制

text-transform:none[正常大小]、capitalize[首字母转大写]、uppercase[转换成大写]、lowercase[转换成小写]

  注意:

    1.字体的属性最好使用引号引起来,而且在设置字体时可以设置多个样式而且样式之间用逗号隔开,前者设置英文字体,后者设置汉文字体。

    2.想要文字在在垂直方向上居中:将行高设置为元素高度(行高=元素高度)(前提:文字的内容不能超过元素的宽度,也就是不能换行)。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2016-03-10 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档