css属性深入

border-width、border-style、border-color这三个边框属性一般都简写为border属性:

div{
border:1px solid red;
}

  border-radius属性是css三中非常常用的一个属性,巧妙运用该属性可以完成很多意想不到的效果。

div{
width:0;
border-top:100px solid #f00;
border-top:100px solid transparent;
border-top:100px solid transparent;
border-radius:50% 50% 0 0 ;
}

  border-image可用图片作边框。

  box-shadow可设置盒阴影。

div{
width:100px;
height:100px;
border:1px solid red;
box-shadow:10px 10px 12px #f00;
}

  line-height可设置行高,注意:该属性不是设置字体高度。将该属性的值与元素的高度设为同一个值可让元素居中,但是只能在一行文本中使用,局限性很大。

p{
height:100px;
line-height:100px;
}

  text-indent设置文本缩进,可代替 

  text-align设置文本水平对齐方式。

p{
text-align:center;

}

  letter-spacing设置字符之间的间隔,英文网站上比较常用。

  background-image和background-repeat、background-color、background-position这几个背景的属性一般用backgrou简写。

div{
background:url(#) no-repeat x y red;
}

  rgba是比较新的一个颜色表示法,a表示透明度,这在以前只能通过opacity来调整。

  linear-gradient也是css的新属性,而且兼容性不是很好。

body{
background-image:linear-gradient(to right,red 50%,blue);
}

  

时间: 2025-01-04 15:27:26

css属性深入的相关文章

CSS属性选择器

属性选择器 1 <!DOCTYPE html> 2 <html lang="zh-cn"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <link rel="stylesheet" type="text/css" href="./css/属性选择器.css&qu

CSS属性

CSS样式属性 一.字体 1.font-family:Tahoma,Arial,"Hiragino Sans GB";字体,第一种字体不能显示时,用第二种字体 2.font-size:xx-small or 10px字体大小:绝对大小:xx-small.x-small.medium.large.x-large.xx-large.x-large.xx-l相对大小:large smaller 使用数字和度量单位绝对单位:px:显示器像素个数mm.cm.in:毫米 厘米 英寸,使用这类单位,

Day49:CSS属性操作(文本、背景、边框、列表、display、边距)

一.CSS属性操作 1.CSS text 文本颜色:color 颜色属性被用来设置文字的颜色. 颜色是通过CSS最经常的指定: 十六进制值 - 如: #FF0000 一个RGB值 - 如: RGB(255,0,0) 颜色的名称 - 如:  red p { color: rebeccapurple; } 水平对齐方式 text-align 属性规定元素中的文本的水平对齐方式. left       把文本排列到左边.默认值:由浏览器决定. right     把文本排列到右边. center 把文

可用于jquery animate()方法的css属性

* backgroundPosition * borderWidth * borderBottomWidth * borderLeftWidth * borderRightWidth * borderTopWidth * borderSpacing * margin * marginBottom * marginLeft * marginRight * marginTop * outlineWidth * padding * paddingBottom * paddingLeft * paddi

与换行相关的css属性简单介绍

与换行相关的css属性简单介绍:在css布局中可能需要人为的进行操作是否换行,如何换行,本章节就就做一下简单介绍.一.word-break属性:此属性用来设定文本如何进行换行.语法结构: word-break:normal | break-all | keep-all 参数解析:1.normal:默认值,原则上规定在断字点换行,通俗的说就是在单词与语单词之间可以进行换行,但是如果单词特别的长,超出了行的长度,可以从单词内部断开进行换行.2.break-all:此属性值能够实现强制将单词从内部截断

JS里引用CSS属性时候的命名

????如果JS代码中设置<p>元素的另一个CSS属性font-family.这个属性的获取方式与color属性略有不同,因为 font和family之间的连字符与JS中减法操作符相同,JS会把它解释为减号.如果你像下边这样访问名为 font-family 的属性,会收到一条出错信息: ????Element.style.font-family ????JS将减号前边的内容解释为"元素的style属性的font属性",把减号后的内容解释为一个名为family的变量,将整个表

前端学习 -- Css -- 属性选择器

属性选择器:根据元素的属性选择指定元素 语法:[属性名] 选取含有指定属性的元素 [属性名="属性值"]:选取属性值等于指定值的元素 [属性名^="属性值"]:选取属性值以指定内容开头的元素 [属性名$="属性值"]:选取属性值以指定内容结尾的元素 [属性名*="属性值"]:选取属性值中包含指定内容的元素 demo:(注:这么尴尬的诗句肯定不是我写的) <!DOCTYPE html> <html> &l

jQuery修改操作css属性实现方法

在jquery中我们要动态的修改css属性我们只要使用css()方法就可以实现了,下面我来给各位同学详细介绍介绍. css()方法在使用上具有多样性,我们先来了解css()方法基本知识. css() 方法设置或返回被选元素的一个或多个样式属性. 返回 CSS 属性如需返回指定的 CSS 属性的值,请使用如下语法: css("propertyname");下面的例子将返回首个匹配元素的 background-color 值: 实例 $("p").css("b

CSS属性之字体(Font)

CSS属性之字体(Font) font:[ [ <font-style> || <font-variant> || <font-weight> ]? <font-size> [ / <line-height> ]? <font-family> ]  复合属性,各属性见下文. 必须同时包含font-size和font-family,且这两个值顺序不能变,其他关键字的值放到这两个值的前面,顺序可以随意打乱. 可以在字号值(font-siz

html文字css属性

color:设定一个标签中的文字的颜色,颜色值可以使用英文单词,16进制语法和rgb语法: font-size: 设定文字大小,单位通常为像素(px)—— 一般的商业网站的文字大小通常都是12px. font-weight: 设置文字粗体(bold)或非粗体(normal). font-style: 设置文字斜体(italic) 或非斜体(normal) font-family:设置文字的字体名字,可以使用多个字体名,中间用逗号分开,表示的含义是:首先使用第一个字体,如果用户电脑中没有第一个,则