css3学习--border
http://blog.sina.com.cn/s/blog_61671b520101gelr.html
border-radius

border-radius: 50px 20px;上下都是50px,左右是20px
border-radius:50px 0px 30px; 上50px 左右0px 下30px;
圆和椭圆的区别在于,椭圆的长短半轴不相等
border-radius还可以用斜杠设置第二组值。这时,第一组值表示水平半径,第二组值表示垂直半径。第二组值也可以同时设置1到4个值,应用规则与第一组值相同
即 border-radius: <length> <length> <length> <length>/<length> <length> <length> <length>
看图比较清楚
border-radius : 10px 30px 50px / 10px 30px 50px;此时是长短半轴相等
border-radius : 50px/80px;
border-radius : 10px 30px 50px / 30px 50px 70px;
border-right-color:#fff; border-radius:50%; 如果全是border,width和height为0
-------------------------------------box-shadow------------------------------------
css3学习--border的更多相关文章
- CSS3学习之圆角box-shadow,阴影border-radius
最近经常玩腾讯微博,出来职业习惯,看看它的CSS,里面运用了大量的css3的东东,有一处用到了Data URI,还有css expression有争议的地方,对png24图片的处理也是用滤镜,类似( ...
- CSS3学习笔记(3)-CSS3边框
p{ font-size: 15px; } .alexrootdiv>div{ background: #eeeeee; border: 1px solid #aaa; width: 99%; ...
- HTML5与CSS3权威指南之CSS3学习记录
title: HTML5与CSS3权威指南之CSS3学习记录 toc: true date: 2018-10-14 00:06:09 学习资料--<HTML5与CSS3权威指南>(第3版) ...
- HTML5 CSS3学习
HTML5 CSS3学习 :http://www.1000zhu.com/course/css3/ HTML5 相关书籍: http://www.html5cn.com.cn/news/gdt/2 ...
- css和css3学习
css和css3学习 css布局理解 css颜色大全 样式的层叠和继承 css ::before和::after伪元素的用法 中文字体font-family常用列表 cursor属性 css选择器 F ...
- CSS3学习总结——实现瀑布流布局与无限加载图片相册
首先给大家看一下瀑布流布局与无限加载图片相册效果图: 一.pic1.html页面代码如下: <!DOCTYPE html> <html> <head> <me ...
- 十天精通CSS3学习笔记 part4
CSS3中的变形与动画(下) CSS3 Keyframes介绍 Keyframes 被称为关键帧,其类似于Flash中的关键帧.在CSS3中其主要以"@keyframes"开头,后 ...
- CSS3学习笔记1-选择器和新增属性
前言:之前自学了一些关于CSS3的知识,在学习过程中也遇到过坑,不过总算磕磕绊绊的学习完了关于CSS3的相关知识,于是最近把之前的笔记和代码整理了一下,也算是一个对CSS3知识的回顾复习吧,也希望能够 ...
- CSS3学习内容与心得
今天2005年7月9号,博客这个东西还真不懂,以前吧我不认识它,它也不认识我.没辙,汤老要我们写,就写吧. 写什么好呢?那就写今天学习的css3的一些要点吧. css这门课程几乎都学完了.而我觉得我还 ...
随机推荐
- Drupal 8.2.4安装简体中文步骤
安装的时候发现很多情况下会出现各种问题,现在写下自己安装成功的步骤: 1.首先官网下载zip安装包drupal-8.2.4.zip 2.下载官方提供的8.2.4简体中文语言包drupal-8.2.4. ...
- 移动端web自适应解决方案: adaptive.js
代码有更新,最好直接查看github github:https://github.com/finance-sh/adaptive adaptivejs利用rem解决移动端页面开发的自适应问题 页面模板 ...
- HTML学习(零)简介
一)HTML介绍 它是一个超文本标记语言,静态页面. 所谓的'超文本'就是指页面内可以包含图片.链接,甚至音乐.程序等非文字元素. 主要的结构为包括"头"部分(英语:Head).和 ...
- 简单的学习心得:网易云课堂Android开发第五章SharedPreferences与文件管理
一.SharedPreferences (1)SharedPreferences能够用来保存一些属于基本数据类型的数据. (2)保存数据,删除数据都是由SharedPreferences的内部接口Ed ...
- 无刷新读取数据库 (ajax)
<html> <head> <script type="text/javascript"> function loadXMLDoc() { va ...
- spring HttpInvoker相关学习资料
官方文档 spring支持的几种RPC 用Http Invoker实现RCP客户端与后台的交互 Java HttpInvoker小试 Spring注解发布RMI/HTTPInvoker/Hessian ...
- BZOJ 2693: jzptab [莫比乌斯反演 线性筛]
2693: jzptab Time Limit: 10 Sec Memory Limit: 512 MBSubmit: 1194 Solved: 455[Submit][Status][Discu ...
- BZOJ2301: [HAOI2011]Problem b[莫比乌斯反演 容斥原理]【学习笔记】
2301: [HAOI2011]Problem b Time Limit: 50 Sec Memory Limit: 256 MBSubmit: 4032 Solved: 1817[Submit] ...
- 嵌入式Linux驱动学习之路(二十四)Nor Flash驱动程序
Nor Flash和Nand Flash的不同: 类型 NOR Flash Nand Flash 接口 RAM-like,引脚多 引脚少 容量 小(1M.2M...) 大(512M.1G) 读 简 ...
- BZOJ1500[NOI2005]维修数列
Description Input 输入的第1 行包含两个数N 和M(M ≤20 000),N 表示初始时数列中数的个数,M表示要进行的操作数目.第2行包含N个数字,描述初始时的数列.以下M行,每行一 ...