<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
/*CSS边框属性*/
/*border:宽度 样式 颜色;三个值一个都不能丢*/
/*border-color:颜色;*/
/*border-style:边框样式;solid实线,dotted点状线,dashed虚线;*/
/*border-width:边框宽度;*/
/*border-left-color:左边框颜色;*/
/*border-left-style:左边框样式;*/
/*border-left-width:左边框宽度;*/
/*border-radius:圆角角度;*/
/*box-shadow:x轴偏移 y轴偏移 模糊度 扩散程度 颜色 inset内阴影;设置或检索阴影*/
.border{
width: 200px;
height: 200px;
border: 2px solid blueviolet;
border-radius:10% 20% 30% 50%;
box-shadow:10px 10px 10px 10px darkblue inset;
}
.border:hover{
width: 200px;
height: 200px;
border: 2px solid blueviolet;
border-radius:0%;
box-shadow:10px 10px 20px 10px #ccc;
}
</style>
</head>
<body>
<div class="border"></div>
</body>
</html>

CSS-08-边框属性设置的更多相关文章

  1. CSS border边框属性教程(color style)

    CSS 边框即CSS border-border边框样式颜色.边框样式.边框宽度的语法结构与应用案例教程篇 一.CSS 边框基础知识 CSS 边框即CSS border是控制对象的边框边线宽度.颜色. ...

  2. CSS之边框属性

    border-style 属性用于设置元素所有边框的样式,或者单独地为各边设置边框样式. border-style:dotted solid double dashed; border-style的属 ...

  3. css keyframes动画属性设置

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. CSS的背景属性和边框属性

    CSS的背景属性: background 简写属性,作用是将背景属性设置在一个声明中 background-attachment 背景图像是否固定或者随着页面的其余部分滚动 background-co ...

  5. CSS常用样式属性

    1.CSS字体和文本相关属性 属性 font-family 规定文本的字体系列,比如:“serif” ''sans-serif" font-size 规定文本的字体尺寸 font-style ...

  6. !!!css如何让img图片居中?css的display属性实现图片居中(代码实例)

    在我们开发前端页面的时候,为了让页面效果美观,会让图片呈现居中效果.那么css怎么让img图片居中显示呢?本篇文章给大家带来css如何让img图片居中?css的display属性实现图片居中(代码实例 ...

  7. CSS border-right-style属性设置元素的右边框样式

    CSS border-right-style属性设置元素的右边框样式 边框的样式指的是边框的线条属性,指的是边框采用的是实线效果.短线效果还是其它的线条效果. border-right-style属性 ...

  8. css3设置边框属性

    css设置边框属性:设置边框圆角 <!DOCTYPE html> <html> <head lang="en"> <meta charse ...

  9. div介绍 盒子模型边框属性 CSS初始化 文字排版 边框调整 溢出

    今天学习的div,了解了div是干什么用的掌握了什么是盒子模型,以及div的外边距内边距以及边框,运用div和CSS给文字排版,利用边框的来做图像,div溢出的处理 CSS初始化: 精确排版的时候用这 ...

  10. 前端学习笔记之CSS属性设置

    CSS属性设置   阅读目录 一 字体属性 二 文本属性 三 背景属性 四 盒子模型 五 盒子模型各部分详解 一 字体属性 1.font-weight:文字粗细 取值 描述 normal 默认值,标准 ...

随机推荐

  1. Android studio相关设置及实现存在于工程目录中的视频播放

    一:相关设置 1:主题设置 File-->Settings-->Appearance &Behavior-->Appearance-->THeme 2:Java源码的颜 ...

  2. Keras文本预处理

    学习了Keras文档里的文本预处理部分,参考网上代码写了个例子 import keras.preprocessing.text as T from keras.preprocessing.text i ...

  3. 更新到@vue/cli 4.1.1版本的前端开发前的准备

    一.概念简述 1.node.js目的是提供一个JS的运行环境. 2.npm(node package manager)是一个JS包管理器. 二.检查自己的电脑是否已安装相关配置 1.查看node.js ...

  4. 牛客国庆days赛 地铁

    传送门:https://ac.nowcoder.com/acm/problem/52805 我佛了,还能跑边图啊!!! 跑边图不能用vector啦啦啦啦啦 具体也不难,就直接上代码了 #include ...

  5. 给你的 ASP.NET Core 程序插上 Feature Flag 的翅膀

    前言 我们知道,目前大多数应用程序在正式发布到生产环境之前都会经历多个不同的测试环境,通过让应用程序在多个不同的环境中运行来及时发现并解决问题,避免在线上发生不必要的损失.这是对于整个软件的发布流程来 ...

  6. 【转载】JavaScript术语:shim 和 polyfill

    在学习和使用 JavaScript 的时候,我们会经常碰到两个术语:shim 和 polyfill.它们有许多定义和解释,意思相近又有差异. Shim Shim 指的是在一个旧的环境中模拟出一个新 A ...

  7. 【游记】THUWC2019-2 Bystander

    [游记]THUWC2019-2 Bystander Day0/-1 感觉自己怎么样都去不了PKUWC(没错)了,差点放弃模拟面试,在老妈的要求下勉强面试,自我介绍没怎么准备,然后就说 我喜欢唱跳Rap ...

  8. 什么是Ceph存储?什么是分布式存储?简单明了带你学Ceph--<1>

    Ceph存储介绍 为什么要用Ceph Ceph是当前非常流行的开源分布式存储系统,具有高扩展性.高性能.高可靠性等优点,同时提供块存储服务(rbd).对象存储服务(rgw)以及文件系统存储服务(cep ...

  9. jib-maven-plugin构建镜像

    序言 在本次期末设计当中,应为需要做部署脚本,我们采用的是dockerfile+docker-compose的部署方式,这种方式对vue项目是没有问题的,因为vue下载依赖与打包是分离开来的,即使修改 ...

  10. 「洛谷P1306」斐波那契公约数 解题报告

    P1306 斐波那契公约数 题目描述 对于Fibonacci数列:1,1,2,3,5,8,13......大家应该很熟悉吧~~~但是现在有一个很"简单"问题:第n项和第m项的最大公 ...