bordercolor和borderstyle(border的颜色) |
您所在的位置:网站首页 › html中border-width › bordercolor和borderstyle(border的颜色) |
本文目录border的颜色VB中复选按钮中的style属性值是什么CSS加虚线是哪个属性HTML中表格的边框颜色用bordercolor修改无效border-color属性为什么要放在border后面边框相关的三个样式css里设置border颜色html中怎么去掉表格边框线的CSS border(边框)样式写法总结border的颜色 语法:border-color : color参数:color : 指定颜色。请参阅颜色单位和附录:颜色表说明:如果只提供一个,将用于全部的四条边。如果提供两个,第一个用于上-下,第二个用于左-右。如果提供三个,第一个用于上,第二个用于左-右,第三个用于下。如果border-width等于0或border-style设置为none,本属性将失去作用。对应的脚本特性为borderColor。请参阅我编写的其他书目。示例:body { border-color: silver ;red; }body { border-color: silver red RGB(223, 94, 77); }body { border-color: silver red RGB(223, 94, 77) black; } VB中复选按钮中的style属性值是什么style属性:设置对象的外观形式 , 取值: 0:Standard( 标准 , 标准风格 ); 1:Graphical( 图形 , 带有自定义图片 ), 此时 Picture,DisabledPicture 和 DownPicture 属性起作用。 复选框:一组检查框控件可以提供多个选项,它们彼此独立工作,所以可以同时选择任意多个选项,实现一种“不定项选择”的功能。 选择某一选项,该控件显示√,而清除此选项后,√消失。 扩展资料: VB中复选按钮其他属性: 1、Name:复选框控件的名称。 2、Alignment:设置标题文本的对齐方式 , 取值为: 0:左对齐; 1:右对齐。 3、BackColor:设置背景颜色 , 可从弹出的调色板选择。 4、CauseValidation:该控件获得焦点时 , 失去焦点的控件的 Validate 事件是否发生。取值: True:发生; False:不发生。 5、DataField:获得或设置一个值 , 将控件绑定到当前记录的一个字段。 CSS加虚线是哪个属性在CSS 中常见的边框(border) 属性有以下几种: border-style border-width border-color border-top-, border-left-, border-bottom-, border-right- border border-styleborder-style属性指定边框的样式。以下的表格列出这个属性可能有的值,以及每一个值显现出来的结果。 border-widthborder-width属性是用来设定边框的宽度。可用的值为thin (薄)、medium (中等)、thick (厚),或是一个数字。 border-colorborder-color属性是用来设定边宽的颜色。 border-top-, border-left-, border-bottom-, border-right-我们可以将方向(top -上、bottom -下、left -左、right -右)和样式、宽度、及颜色合起来而成为一个属性。举例来说, border-top-style属性就是用来设定上边框的样式。以下举几个例子: border若四边的边框属性都一样,那我们可以用一个border属性来描述,而不必四个边都描述一次。另外,我们可以在同一行一次宣告边框样式、边框宽度、以及边框颜色。 p {border:#0000FF 5px solid; } 那以下的HTML, 《p》用一行来宣布所有边框的属性《/p》 会显现出 HTML中表格的边框颜色用bordercolor修改无效你用的是什么浏览器(我们做网页的一般都会用火狐浏览器) 你代码中缺少《/table》 我这边运行你的代码是这样的效果 border-color属性为什么要放在border后面border属性有三个子属性:线宽线型颜色。所以你列出的代码里,就是按照这个顺序定义的。定义border的时候,可以直接用border属性,也可以分别用border-width,border-style,border-color定义。如果用border定义的话,就要把三个子属性的值全部写出,而且中间用空格分隔,不能用其他的字符。 边框相关的三个样式边框(border) 边框相关的三个样式 border-color 边框的颜色 border-color:#00ffcc; border-style 边框的样式 border-style:dashed; border-width 边框的宽度 border-width:30px; 边框会影响到盒子的可见框大小 border-width表示边框的宽度 - 可以通过该属性分别制定边框四个方向的宽度 border-width: 10px 20px 30px 40px; 如果指定了四个宽度,则会分别设置上右下左四个方向的边框的宽度 border-width: 10px 20px 30px; 三个值:上 左右 下 border-width: 10px 20px; 两个值:上下 左右 border-width: 10px; 一个值:上下左右 border-color边框的颜色,可以分别指定四个边的颜色,规则和border-width一样。 border-color: red orange blue aqua; 上右下左----顺时针旋转 border-color: silver; border-style 指定边框的样式 solid 实线 dotted 点状虚线 dashed 虚线 double 双线 border-style: solid dotted dashed double;------顺时针旋转 border-style: solid dotted dashed ;--------------上左右下 border-style: solid dotted;------------------------上下左右 border-right: yellow solid ; 边框(border) 不指定宽度,默认宽度 一般3px 不指定颜色,默认使用字体颜色-随字体颜色变 边框可同时设置四个方向边框的宽度、颜色、样式,并且没有顺序要求 border:red 10px solid 除了border还有四个 border-top 上 border-right 右 border-bottom 下 border-left 左 内边距(padding)边框和内容区之间的距离叫做内边距 盒子的可见框大小由内容区,内边距和边框共同决定 四个方向的内边距 padding-top 上 padding-right 右 padding-bottom下 padding-left 左 通过padding来同时设置四个方向的内边距,规则和border-width一样 padding: 10px 20px 30px 40px; padding: 10px 20px 30px ; padding: 10px 20px ; padding: 10px ; 外边框(margin) 当前盒子和其他盒子之间的距离,外边距不会影响盒子的可见框的大小,但是外边距会影响到盒子实际占地的大小,影响盒子的位置。 四个方向的外边距: margin-top margin-right margin-bottom margin-left 由于在浏览器中默认情况下,元素是靠左靠上排列的,所以设置上左外边距时,会移动元素自身,而设置下和右外边距时,会移动其他元素 外边距可以是负值,如果是负值则元素会向相反方向移动 margin-top: -50px; 同时设置四个方向的外边距margin: 10px 20px 30px 40px; 水平方向布局 子元素在父元素的位置是父元素的内容区 子元素在父元素中的水平方向的布局,必须满足如下等式 margin-left + border-left + padding-left + width + padding-right + border-right + margin-right = 父元素的width(7个值和=父元素的宽度) 在水平方向,有三个值可以设置auto 分别是 margin-left width margin-right 设置为auto以后,浏览器会自动计算该属性的值 - 若七个值和相加不等于父元素宽度,则属于过度约束,则浏览器会自动调整右外边距的值 - 如果将margin-left 或 margin-right 的一侧设置为auto,则另一侧会设置尽量大的值 - 若left和right都设置auto,则会将两侧外边距设置相等的值,导致子元素在父元素中水平居中 垂直方向布局:(简单) margin-top+border-top+padding-top+height+margin-bottom+border-bottom+padding-bottom=父元素高度 box1》box2: width设置auto时,子元素会占满父元素 height设置auto时,父元素的高度由子元素内容决定 1. 当父元素写死时,子元素的高度高于父元素时,会溢出,溢出的子元素不会影响页面布局。 使用 overflow 来设置溢出内容的处理方式: 可选值: visible,默认值 溢出内容不会被裁剪直接在父元素外部显示 hidden,溢出的内容会被裁剪,超过父元素的不会显示 scroll,生成滚动条,可以通过滚动条查看完整内容,滚动条一直在 auto,根据需要生成滚动条 2. 兄弟元素的外边距的折叠(margin) .box1{ height:100px; Width:100px; Margin-bottom:100px; } .box2{ height:100px; Width:100px; Margin-top:100px; } 外边距的折叠,垂直方向相邻的外边距,会发生外边距折叠现象。 兄弟元素间的相邻外边距,会去两个外边距间的最大值(正值);如果是负值,取绝对值较大的。 两个外边距:相邻的外边距,谁大用谁的距离 一正一负:取两个值的和 3. 父子元素的外边距折叠 父子元素的相邻垂直外边距,子元素的外边距会传递给父元素 .box1{ width:200px; heigth:300px; background-color:#bfa; border-top:1px red solid; } .box2{ width:200px; heigth:300px; background-color:orange; margin-top:100px; } 4. 文档流(常规流、标准流) -文档流是网页中的一个位置,默认情况下页面中的所有元素都在文档流中排列 -块元素在文档流中的特点 自上向下进行排列(独占一行) 默认宽度和元素一样 默认高度被内容撑开 《div》 《/div》 -行内元素在文档流中的特点 自左向右水平排列,如果一行中不足以容纳所有元素则切换到下一行继续自左向右水平排列 默认高度和宽度都会被内容撑开 《span》 《/span》 5. 行内元素的盒模型 内联元素不支持设置宽度和高度《span》 《/span》 内联元素可以设置padding(border),但垂直方向padding(border)不会影响页面的布局 内联元素支持水平方向的外边距,不支持垂直方向的 6. display -指定元素所产生的框的类型 -可选值: inline行内元素 block块元素 inline-block行内块元素 -既有行内元素的特点,不会独占一行;又有块元素的特点,可设置宽高 none元素不在页面中显示 内联元素无法改变宽度和高度,将超链接变成块元素,就可以改变大小 display:block; a{ width:200px; height:200px; background:#ofd; dispaly:none; } .box1:hover a { ////鼠标碰到连接时出现 display:block;///////////inline } 7. visibility设置元素的显示状态 可选值:visible:默认值,元素正常显示 hidden不显示元素,但元素依旧占据位置 display:none :不显示元素,而且不占据位置 8. 二级菜单 当鼠标移动到xxx时,显示二级菜单 .outer》xxx:hover .inner{祖先与后代关系 display:block;} 9. 默认样式 为了确保网页在没有样式的情况下,也可以浏览,所以浏览器都会为网页设置一些默认样式,对开发者来说没有任何作用,并且不同的浏览器所设置的默认样式不同,开发中第一件事就是去除浏览器的默认样式。 *{margin:0; padding:0; 去掉所有边框,外边界} 重点:CSS权威指南---利用reset.css直接引入,可以去除所有默认样式,推荐 normalize.css--统一 10. 块元素和行内元素一般情况下,只会在块中放内联元素,不会向内联元素放块元素 块元素:用于页面的布局 p:不能放任何块元素 行内元素:主要用于页面中选中文字 a:什么都能放,除了自己 11. .img-list {height:190px; width:470px; background-color:#33ffss; margin:auto; //居中 list-style:none; //去掉列表前面的样式} .img-list img{ height:100%; width:100%;} 《ul class=’img-list’》 《li》《a href=”#”》《img src=”img/1.jpg”》《/a》《/li》 《li》《a href=”#”》《img src=”img/2.jpg”》《/a》《/li》 《li》《a href=”#”》《img src=”img/3.jpg”》《/a》《/li》 《/ul》 12. 文本修饰text-decoration:none: 去除下划线 《style》 .nav {width:190px; height:450px; padding:10px 0; margin:0 auto; list-style:none; background-color:white;} .nav li {height:25px; padding-left:18px;} .nav li:hover{ background-color:gray;} .nav li a{ font-size:18px; text-decoration:none; color:#333;} .nav li a:hover{ color:red;} 《/style》 《ul class=’nav’》 《li》《a href=”#”》xxx《/a》《/li》 《li》《a href=”#”》xxx《/a》《a href=”#”》xxx《/a》《a href=”#”》xxx《/a》《/li》 《li》《a href=”#”》xxx《/a》《a href=”#”》xxx《/a》《a href=”#”》xxx《/a》《/li》 《/ul》 龙华大道1号 http://www.kinghill.cn/LongHuaDaDao1Hao/index.html css里设置border颜色border:solid 1px #ffffff;解释:border:样式 宽度 颜色;大部分元素的默认宽度为0,如果不设置宽度,即使设置了样式和颜色也没用。 html中怎么去掉表格边框线的html中去掉表格边框线可以将boder属性设置成0px solid即可。如下图所示: border 简写属性在一个声明设置所有的边框属性。 为边框指定宽度有两种方法:可以指定长度值,比如 2px 或 0.1em(单位为 px, pt, cm, em 等),或者使用 3 个关键字之一,它们分别是 thick 、medium(默认值) 和 thin。 注意:CSS 没有定义 3 个关键字的具体宽度,所以一个用户可能把 thick 、medium 和 thin 分别设置为等于 5px、3px 和 2px,而另一个用户则分别设置为 3px、2px 和 1px。 扩展资料 边框颜色设置方法介绍: border-color属性用于设置边框的颜色。可以设置的颜色: name - 指定颜色的名称,如 “red“ RGB - 指定 RGB 值, 如 “rgb(255,0,0)“ Hex - 指定16进制值, 如 “#ff0000“ 还可以设置边框的颜色为“transparent“。 注意: border-color单独使用是不起作用的,必须得先使用border-style来设置边框样式。示例: p.one{ border-style:solid; border-color:red;} CSS border(边框)样式写法总结border属性:在网页中设置元素的边框样式。可同时设置边框宽度、边框样式、边框颜色。也可以单独设置上边、右边、下边、左边的边框。语法:border: border-width | border-style | border-color;border-width:边框宽度。可以指定长度值。如1px,1em(单位为px,pt,em等)。或者使用关键字medium(默认),thick,thin。 border-top-width:设置元素上边框宽度 border-right-width:设置元素右边框宽度 border-bottom-width:设置元素下边框宽度 border-left-width:设置元素左边框宽度border-style:边框样式。 border-top-style:设置元素上边框样式 border-right-style:设置元素右边框样式 border-bottom-style:设置元素下边框样式 border-left-style:设置元素左边框样式 属性值有: none:无边框。 hidden:隐藏边框。对于表,hidden 用于解决边框冲突。 dotted:点状边框。 dashed:虚线边框。 solid:实线边框。 double:双线边框。两条单线与其间隔的和等于指定的border-width值。 groove:3D凹槽边框。 ridge:3D垄状边框。 inset:凹边框。 outset:凸边框。border-color:边框颜色。 1.1 边框各样式效果图 1.2 四条边颜色样式相同 1.3 四条边颜色不同,样式相同 1.4 四条边颜色相同,样式不同 1.5 设置上边框宽度、样式、颜色 1.6 设置右边框宽度、样式、颜色 1.7 设置下边框宽度、样式、颜色 1.8 设置左边框宽度、样式、颜色 以上对border边框属性进行了基础操作,大家可以根据自己的经验为边框制作出更漂亮的样式。如若大家有什么更好的见解,那就在回复区畅所欲言吧,我定会吸取精华~如有写错欢迎大家回复,我以后定会更加细心 _ |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |