updream 一键生成高质量推广成片 AniShort AI短剧协同制作平台 Laper 剧本策划到成片协作 立刻MV 低成本歌曲 MV、视频生成

CSS中的边框样式 登录

下一节课程: CSS中的背景控制 (2070次播放)

5 秒后自动播放下一节
  重新观看
介绍 >

Web开发基础_HTML+CSS

难度:初级 共17节 48576次学习

新课:PHP零基础(CMS开发)教学!

立即报名
章节 评论 笔记 课件
第1章 web前端基础

web前端基础(学习html和css我们可以做什么)

11分钟45秒

html基础

第2章 HTML中常用标签及属性

HTML中的常用标签及属性(文档头部 head)

HTML中的常用标签及属性(文本 字体格式化)

HTML中的常用标签及属性(超链接)

HTML中的常用标签及属性(列表)

HTML中的常用标签及属性(form表单)

HTML中的常用标签及属性(表格)

第3章 CSS基础及样式控制

css基础

CSS中的盒模型

CSS中的边框样式

CSS中的背景控制

块级元素和行内元素相互转换

CSS中的定位

CSS中的浮动

第4章 HTML+CSS常用布局案例

常用导航布局案例

简单CSS3下拉菜单效果实现

全部评论我要评论

暂无评论~

全部笔记发布笔记

  • 土豆烧牛肉

    土豆烧牛肉7年前

    border solid dasher double dotted line-height border-radius box shadow

    0

  • 烛光

    烛光7年前

    border样式中的边框线有哪些: solid实线、double双实线、dashed虚线、dotted点虚线

    border-raidus设置边框的圆角 box-shadow:设置边框的阴影 box-shadow:0px 6px 30px #ccc inset; 默认是向外的阴影,如果设置inset则向内的阴影

    0

  • hcc

    hcc7年前

    内部阴影: box-shadow:x轴 y轴 阴影宽度 inset

    0

  • A云海

    A云海7年前

    inset 内置阴影 box-shadow 外置阴影 border-radius 圆角 solid 实线 double 双实线 deshed虚线 dotted 点线

    0

  • 云雾幻灵

    云雾幻灵7年前

    border标签:solid实线 double双实线 dashed虚线 dotted点 border-radius:像素 将直角转为圆角 box-shadow:像素 颜色 设置阴影大小、颜色

    0

  • 风轻云淡

    风轻云淡7年前

    border:1px solid #ccc border-radius:50px; box-shadow:0px 6px 10px #ccc

    0

  • 3721

    37217年前

    <html> <head> <meta charset="utf-8"> <title>边框</title> <style type="text/css"> body{background:#66b3ff;}/*背景颜色:浅蓝*/ *{padding:0px;margin:0px;}/*去除页面边距*/ h3{color:yellow;margin:20px 0px 0px 20px;}/*设置为黄色,内边距上部和左边都为20*/ span{font-size:2em;color:pink;}/*字体2倍大小,颜色粉色*/ .t1{width:100px;height:150px;border:2px;border-radius:15px;background:#ccc;padding-top:10px;padding-left:5px;margin-left:50px;color:#000;}/*设置大小,边框为2,圆角,背景色,上内边距10(为了显示文字),左内边距5,左外边距50,字体黑色*/ .t2{width:100px;height:150px;border:2px;border:dashed blue;margin:10px 0px 0px 70px;padding-left:3px;background:red;color:#fff;}/*设置大小,边框为2,虚线边框,蓝色,外边距上为10(与上面元素隔开),左为70,(下面几个元素依次递增20,为了有楼梯效果),左内边距3,红背景色,字体颜色白色*/ .t3{width:100px;height:150px;border:dotted green;margin:10px 0px 0px 90px;background:#000;color:#fff;}/*设置大小,边框点状虚线,绿色,外边距上10左90,背景色黑色,字体颜色:白*/ .t4{width:100px;height:150px;background:pink;border-left:3px solid green;border-bottom:3px solid green;margin:10px 0px 0px 110px;}/*设置大小,背景色:粉色,左边框粗细3,实线,绿色,下边框粗细3,实线,绿色,外边距上10左110*/ .t5{width:100px;height:150px;margin:10px 0px 0px 130px;border:none;background:#ccc;box-shadow:6px 3px 3px blue;}/*设置大小,外边距上10左130,边框不显示,背景色ccc,阴影:X轴6,Y轴3,阴影宽度3,阴影颜色:蓝色*/ .t6{width:100px;height:150px;margin:10px 0px 30px 150px;background:#f75000;box-shadow:inset 0px 20px 80px yellow;}/*设置大小,外边距上10,下30(由于下面没有元素,为了完整显示这个div,所以设置下30px),左150,背景色#f75000,阴影:内部,X轴0,Y轴20,阴影宽度80,阴影颜色:黄色*/ </style> </head> <body> <h3>下面是<span>边框</span>练习的实例</h3><br> <div class="t1">圆角边框</div> <div class="t2">虚线边框</div> <div class="t3">点状边框</div> <div class="t4">只有左下边框</div> <div class="t5">外部阴影</div> <div class="t6">内部阴影</div> </body> </html>

    0

  • 宇宙

    宇宙7年前

    border边框 solid实线 double双线 dashed虚线 dotted点状虚线

    0

  • 取消 回复 发送
  • 取消 发布笔记 发送