css常见属性和属性值

CSS常见属性和属性值

  1. 字体属性

    1. Font-family 字体族科  宋体|微软雅黑
    2. Font-size  字体大小
    3. Font-style  字体样式  normal|italic(倾斜)|oblique(斜体)

不是所有的字体都支持倾斜 如果没有倾斜那么你就必须使用斜体来代替倾斜

  1. Font-weight 字体加粗  normal |bold(加粗)|lighter(变细)
  2. Font-variant 字体变形   normal|small-caps

Font:[字体风格] [字体变形] [字体加粗] <字体大小>[/行高] <字体族科>

注意:每个内容和内容之间要有空格

Url  ./  http://www.

Src  引入 拿取过来内容

Href 引用 连接前往 a  link

现在所有的命名 请按照下面我说的去命名

可以使用字母 数字 下划线组成  但是不能以数字开头

一、CSS常用属性

  1. 颜色属性

Color

2背景属性

mso-para-margin-left:0.0000gd;text-indent:21.0000pt;mso-char-indent-count:0.0000;">Background-image: 背景图片

Background-repeat: 背景重复

Repeat-x(x轴方向重复) | repeat-y(y轴方向重复) |no-repeat(不重复)

Background-attachment: 背景附件 scroll(默认值)  fixed(固定)

Background-position:背景位置

Left|center|right( 横向)

Top|center|bottom(纵向)

像素

注意:background-position 两个值之间需要使用空格隔开

Background:<背景颜色>|<背景图片>|<背景重复>|<背景附件>|<背景位置>

每个属性中间都要用空格隔开

3边框属性

border-style 边框样式

Border-top-style

Border-left-style

Border-bottom-style

Border-right-style

值:

dotted 点线

Dashed 虚线

Solid   实线

Double 双实线

Groove 槽状线

Ridge   脊线

Inset  内嵌效果

Outset 外凸效果

Border-width 边框宽度

单位使用像素

同上

Border-color  边框颜色

同上

Border:边框宽度 边框样式 边框颜色;

4文本属性

Letter-spacing  字母间隔  值为长度  值可以是负值 可以支持中文

Word -spacing  词间距   值为长度  值可以是负值 抓取词边界  可以支持中文但是 请加上词边界

Text-decoration 文本修饰

None(默认值) 通常我们使用这个属性将a标签的默认下划线取消

Underline 定义文本下的一条线

Overline 定义文本上的一条线

Line-through  定义穿过文本中的一条线

Text-align 对齐方式

Left|center|right|justify(两端对齐)

Justify 将我们的文字贴近我们的边框 将我们的空白留给中间

Text-indent  文本缩进  2em
line-height 设置行间距离(行高)   不允许出现负值

作用:用来将文本居中显示 一般都是和设置的高度相同 让文字垂直居中显示

5. 鼠标光标属性

Cursor

Text      文本

Crosshair 十字架

Wait     等待

Help     帮助

Pointer   小手

6.列表属性

List-style-type  列表样式类型

值:

Disc 实心点

Circle 圆圈

Square 小方块

Decimal   数字

Lower-roman  小写罗马字

Upper-roman  大写罗马字

Lower-alpha   小写字母

Upper-alpha   大写字母

None 没有标识

List-style-image  列表样式图片

url()

List-style-position 列表样式位置

Inside 表示在li里面

Outside 表示在li外面(默认值)

作用:就是让你来判断是否控制图片被样式表是否修改

三、无意义标签

Div

块级标签,会自动换行(独占一行)

Span

行内标签 内容显示在一行内

块级元素的特点:

1.总是独自占一行显示

2.高度、行高和内边距外边距 都可以控制

3.宽度和浏览器宽度一样 与内容无关

4.可以容纳行内元素和其他块元素

行内元素特点:

1.和其他标签在同一行内显示

2.高度 行高 内边距 外边距 部分可控

3.与内容有关 内容改变宽度改变

容纳文本和其他行内元素

时间: 2024-08-08 13:48:05

css常见属性和属性值的相关文章

IT兄弟连 HTML5教程 CSS3揭秘 CSS常见的样式属性和值1

CSS中的样式属性比较多,经常使用的属性可以分为这么几类:字体.文本.背景.位置.边框.列表,以及其他一些样式属性.每个类中的属性都可以单独使用:如果同一个类中多个属性一起使用,还可以将它们整合为一行解决. 1  字体属性 通过字体属性可以设置字体的族科,改变字体的大小和风格,也可以调整字体加粗,以及让字体变形等.修饰字体的所有属性.值及描述如表6-1所示. 表1  CSS中修饰字体的属性 分别使用表1中字体类的每个样式属性,指定HTML的段落元素p中的字体为bold(粗体).italic(斜体

IT兄弟连 HTML5教程 CSS3揭秘 CSS常见的样式属性和值2

3  背景属性 大多数HTML元素都允许控制背景,包括背景颜色.背景图像.背景重复.背景附件.背景位置等属性.常见的控制背景属性.值及描述如表2所示. 表2  CSS中常见的控制背景的属性 除了使用表6-2中提供的背景属性控制HTML元素的背景样式,也可以将其简化为使用一行代码解决.通过背景类中的background属性实现,语法格式如下所示: background:  <背景颜色> || <背景图像> || <背景重复> || <背景附件> || <

CSS常见的中属性级,选择符级的Hack

注意:尽量找到通用方法而减少对CSS Hack的使用,大规模使用CSS Hack会带来维护成本的提高以及浏览器版本变化而带来类似Hack失效等系列问题. 星号 * 针对IE6,7:下划线 _ 针对ie6 例如: _background: red; 属性级: \9 适用性IE6+ .background-color:#00deff\9; \0 适用性IE8+,是IE8/9/10的hack .background-color:#00deff\0; * ie6 7 (IE6 7以上亦可) *backg

css常见属性

### css常见属性- color:red/rgb(255,0,0)/#f00; + 注意,如果有a链接,必须在a链接中设置字体的颜色:在外面设置a链接中的字体颜色,无效:- font:400 14px/28px "宋体 微软雅黑": + font-weight:400; bold->700; + font-size:14px; + line-height:28px; + font-family:"宋体"- background:url("相对地址

CSS基础【2】:CSS常见属性

CSS常见属性 文字属性 font-style 作用:规定文字样式 格式:font-style: italic; 取值: normal:正常的,默认就是正常的 italic:倾斜的 font-weight 作用:规定文字粗细 格式:font-weight: bold; 单词取值: bold 加粗 bolder 比加粗还要粗 lighter 细线, 默认就是细线 数字取值: 100 - 900之间整百的数字 font-size 作用:规定文字大小 格式:font-size: 30px; 取值:px

css中一些常用的属性和属性值

今天和大家分享一下有关css中的一些常用的属性和属性值: ①颜色属性 color ②background  背景属性 其属性值有: 1,Background-image: 背景图片 2,Background-repeat: 背景重复 Repeat-x(x轴方向重复) | repeat-y(y轴方向重复) |no-repeat(不重复) 3,Background-attachment: 背景附件 scroll(默认值)  fixed(固定) 4,Background-position:背景位置 L

css基础 属性选择器 属性值以指定字符开头 / 结束

礼悟:    公恒学思合行悟,尊师重道存感恩.叶见寻根三返一,江河湖海同一体.          虚怀若谷良心主,愿行无悔给最苦.读书锻炼养身心,诚劝且行且珍惜.              ide:visual studio 2017             browser:Chrome                     os:win7 代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8&qu

web前端入门到实战:CSS Display属性的双值写法

display属性 display 属性用来控制一个元素及其子元素的 格式化上下文, 你应该在刚刚学习CSS的时候就知道,有些元素是块级元素,有些则是行内元素. 有了 display 属性,你就可以切换元素不同的状态.比如说,通常一个 h1 元素是一个块级元素,但是通过切换,它就能以内联元素展现. 这几年,我们也知道了Grid 布局和弹性盒布局.我们只需要将 display 属性的值设置为 display: grid 或 display: flex 就可以实现这两种布局.当 display 属性

CSS 详细解读定位属性 position 以及参数

一直对这个属性不懂,终于找到一个地址,看懂了说明.原地址https://blog.csdn.net/fen584521/article/details/52123368 position 定位属性,是CSS中非常重要的属性.除了文档流布局,就是定位布局了. 其参数主要有以下: absolute 生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位. 元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定. fixed 生成绝对定位的