软考在线  |  计算机技术与软件专业技术资格(水平)考试   |   [请选择科目]
[ 成为 VIP会员 ]        登录  |  注册      我的  购物车
0
 
科目切换  联系我们 
    
  |   [请选择科目]

VIP:有效提升20分!  真题  历年真题 (可免费开通)/  百科全书/ 机考模拟平台/  最难真题榜/  自测/  攻打黄金十二宫/  真题检索/  真题下载/  真题词库
知识   必会知识榜/  最难知识榜/  知识点查询/      文档   学习计划/  精华笔记/  试题文档     纸质图书   《百科全书》HOT!!/         /        首页/  2025年上半年专区/  手机版/ 
首页 > 知识点讲解
       CSS/CSS3设置边框和边距
知识路径: > 电子商务系统程序设计基础 > Web 设计基础 > CSS3 样式表 > CSS3样式表 > 
被考次数:3次     被考频率:中频率     总体答错率:44%     知识难度系数:     
考试要求:掌握      相关知识点:39个      
        边框属性包括边框样式、边框颜色和边框宽度,主要用来设置网页中各个元素的边框。
               设计边框样式border-style
               基本语法:
               
               语法说明:边框样式属性中border-style是一个复合属性,其他4个都是单个边框的样式属性,只能取一个值,而复合属性border-style可以同时取1到4个值。下面分别说明border-style属性的4个取值方法:取一个值,四条边框均使用这一个值;取两个值,上下边框使用第一个值,左右边框使用第二个值,两个值一定要用空格隔开;取三个值,上边框使用第一个值,左右边框使用第二个值,下边框使用第三个值,取值之间要用空格隔开;取第四个值,四条边框按照上、右、下、左的顺序来调用取值。取值之间也要用空格隔开。具体的样式取值和说明如下表所示。
               
               边框样式属性取值说明
               
               调整边框宽度border-width
               基本语法:
               
               语法说明:基本语法中边框宽度属性border-width是一个复合属性,可以同时设置四条边框的宽度。具体使用方法和边框样式的复合属性border-style是一样的。长度包括长度值和长度单位,不可以使用负数。长度单位可以使用绝对单位也可使用相对单位,如px、pt、cm等。
               设置边框颜色border-color
               基本语法:
               
               语法说明:如果只设置1种颜色,则四条边框的颜色一样;设置2种颜色,则边框的上下为一个颜色,左右为另一个颜色;设置3种颜色,边框的颜色顺序为上、左右、下;设置4种颜色,边框的颜色顺序为上、右、下、左。
               设置外边距margin-top/margin-bottom/margin-left/margin-right/margin
               基本语法:
               
               语法说明:margin用来设置元素到上一级元素的外边距。
               设置填充内边距padding-top/padding-bottom/padding-left/padding-right/padding
               基本语法:
               
               语法说明:padding用来设置元素的内边距。
               设置图像边框border-image属性(CSS3新增)
               基本语法:
               
               语法说明:source用于规定是否用图片定义边框样式或者规定图像来源路径。slice用于规定图片的切割位置。width用于规定边框图片宽度。repeat用于规定切割后的边框图片中间部分(演示图片中的黄色部分)在元素对应部分的存在方式。
               设置圆角边框border-radius属性(CSS3新增)
               基本语法:
               
               语法说明:两者之间用"/"分隔,如果只设置水平半径,那么垂直半径的值和水平半径值相同,例如在以上实例中只设置了水平半径,那么水平半径的值也应用于垂直半径。水平半径和垂直半径都可以分别设置四个值:如果只设置了一个值,那么四个圆角都使用这个值。如果设置了两个值,第一个值作用于左上角和右下角,第二个值作用于右上角和左下角。(如果设置了三个值,第一个值作用于左上角,第二个值作用于右上角和左下角,第三个值作用于右下角。如果设置了四个值,那么分别作用于四个角,从左上角开始,按顺时针。
               设置图像边框border-image属性(CSS3新增)
               基本语法:
               
               语法说明:h-shadow设置元素阴影水平偏移量,可以为负值,单位是像素。v-shadow设置元素阴影垂直偏移量,可以为负值,单位是像素。blur设置阴影模糊半径,只能够为正值,如果为0,表示不具有模糊效果,单位是像素。spread设置阴影的扩展半径尺寸,可以为负值,单位是像素。color设置阴影的颜色;省略此参数,浏览器选取默认颜色,浏览器的默认可能不同,有的为透明。inset可以将外部阴影改为内部阴影。
 
 相关知识点:
 
软考在线指南
优惠劵及余额
在线支付
修改密码
下载及使用
购买流程
取消订单
联系我们
关于我们
联系我们
商务合作
旗下网站群
高级资格科目
信息系统项目管理师 系统分析师
系统架构设计师 网络规划设计师
系统规划与管理师
初级资格科目
程序员 网络管理员
信息处理技术员 信息系统运行管理员
中级资格科目
系统集成项目管理工程师 网络工程师
软件设计师 信息系统监理师
信息系统管理工程师 数据库系统工程师
多媒体应用设计师 软件评测师
嵌入式系统设计师 电子商务设计师
信息安全工程师
 

本网站所有产品设计(包括造型,颜色,图案,观感,文字,产品,内容),功能及其展示形式,均已受版权或产权保护。
任何公司及个人不得以任何方式复制部分或全部,违者将依法追究责任,特此声明。
本站部分内容来自互联网或由会员上传,版权归原作者所有。如有问题,请及时联系我们。



京B2-20210865 | 京ICP备2020040059号-5 |京公网安备 11010502032051号 | 营业执照 | Copyright ©2000-2025 All Rights Reserved 软考在线版权所有