border-solid,bordersolid是什么意思

http://www.itjxue.com  2023-01-09 11:08  来源:未知  点击次数: 

solid是什么意思

“Border”(画边框),它是CSS的一个属性,用它可以给能确定范围的HTML标记(如TD、DIV等等)画边框,它可以定义边框线的类型、宽度和颜色,利用这个特性,可以制作一些特殊效果。下面将通过实 例来说明其应用技巧。

1、给文本加边框

上面的示例中,给一段文字加了不同的边框,只是为了说明边框线的颜色、粗细是可变的。第一个边框的CSS代码是:style= "border:thin solid red";“border”后面的三个参数的含义是:边框线的宽度是:thin(细线);边框线的类型: solid(实线);边框线的颜色:red(红色)。我们定义边框,实际上就是设定这三个参数值。

边框线的宽度有三个标准值:thin(细线)、medium(中粗线)和thick(粗线),此外,也可以自定义宽度,如:1pt、5px、2cm等。

边框线的类型有九个确定值:none(无边框线)、 dotted(由点组成的虚线)、 dashed(由短线组成的虚线)、 solid (实线)、 double(双线,双线宽度加上它们之间的空白部分的宽度就等于border-width定义的宽度)、 groove(3D沟槽状的边 框)、 ridge(3D脊状的边框)、 inset(3D内嵌边框,颜色较深)、 outset(3D外嵌边框,颜色较浅),注意:如果系统不支持这些 边框的属性值,那么“dotted”、“dashed”、“double”、“groove”、“ridge”、“inset”和“outset”都会被 “solid”代替。

边框线的颜色:可以用十六进制的颜色代码,如#00ffcc。

从上面可以看出,给文本加边框确实很简单,上例中后面那几个边框的设置,我不讲你也明白了吧!在这里告诉你一点小技巧,给一段文本加边框,可 把CSS加在〈P〉标记里;给几段文本加边框,先把那几段文本用DIV标记括起来,再把CSS加在〈DIV〉标记里;若是要给一行文本加几个不同的边框, 则需要把文本放在表格里,再把CSS分别加到〈TD〉标记里。

css中border-solid长度问题

div style="border-right:1px solid black;float:left"我的收藏/div

div style="float:left"我的购物车/div

设置border的属性。。。间距和字体大小自己设置下就好了。

或者这样:

div style="background-color:black;color:white;width:180px;"

span我的收藏/span | span我的购物车/span

/div

深入理解border属性

1 .css属性是为了显示图文。

2 .边框设计的初衷可能是为了白底的图片和外面区分,所以加一个1px的边框就能看清

3 .边框一般不需要跟随设备变大而变大。

4 .所以其他属性outline,box-shadow,text-shadow也是这来原因而决定的.

1 .1px

2 .thin:1px

3 .medium:3px,默认值。主要是因为border-style:double。至少需要3px才生效

4 .thick:4px

1 .none:所以单纯设置border-width,border-color没有边框显示的原因. 1.5px solid #000 .默认样式是这样

2 .solid:实线

3 .dashed:虚线 :颜色区和透明区的比例所占的不一样,chrome是2:1,IE,火狐是3:1

4 .dotted:圆点边框

5 .double:双线板框。线框的表现还和宽度有关系,宽度不同最后的表现也不一样

6 .其他:inset(内凹),out(外凹),沟槽(groove),ridge(山脊)

1 .border-color默认颜色是color色值,如果没有指定边框颜色,就会使用color的颜色,outline,,box-shadow,text-shadow也是这样

1 .右下方background定位技巧.background定位的一个局限是只能根据左上角定位,而不能相对右下角.一个宽度不固定的元素,我们需要在距离右边缘50像素的位置设置一个背景图片

2 .增加点击区域大小:通过使用透明边框可以增加点击区域的大小

border:50px solid transparent;

3 .三角形绘制

1 .背景图片相对于background-image属性的位置

2 .border-box

3 .content-box

4 .padding-box

1 .center:居中图片

2 .top.left

1 .上面构造出来的全等三角形,其实是由两个直角三角形拼接成的。

2 .所以如果设置某一条边的宽度是0,就可以只显示左边的,实现一个直角三角形

我想问下CSS中如有时个省略前面的如: border-style:solid 打个solid就行了

border:1px solid #999(边框宽度/边框类型/边框颜色)。solid代表实线,建议你就按照我提供的格式这么写,这样既规范又便于以后CSS的修改。主要是培养你书写CSS的好习惯。

JS里只能写单一个CSS。比如background.style,font-family.style

CSS里面border-color与solid在代码运用区别在哪?solid到底是怎么用得?

你所使用的border:1px solid #FF0000;其实就是

border : border-width || border-style || border-color 这个格式

你已经在使用border-color了

solid是border-style,border-style共有以下这些种类

none : 无边框。与任何指定的border-width值无关

hidden : 隐藏边框。IE不支持

dotted : 在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为点线。否则为实线

dashed : 在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为虚线。否则为实线

solid : 实线边框

double : 双线边框。两条单线与其间隔的和等于指定的border-width值

groove : 根据border-color的值画3D凹槽

ridge : 根据border-color的值画菱形边框

inset : 根据border-color的值画3D凹边

outset : 根据border-color的值画3D凸边

(责任编辑:IT教学网)

更多

推荐其它系统文章