HTML基础(2)——边框
边框:(尺寸 样式 颜色)
div{border:1px solid red;}
样式可能的值:
dotted(点状边框,在大多数浏览器里呈现实线)
dashed(虚线。在大多数浏览器中呈现为实线)
solid(实线)
double(双线)
边框的方向:top right bottom left;
改变上边框:border-top:5px dashed black;
只改变上边框颜色:border-top-color:red;
那么,边框是什么形状呢?这取决于容器的大小,是一个非矩形。
来点炫酷的,边框三角形!
div{width:0px;
height:0px;
border:10px solid #fff;
border-top-color:#ccc;
}
HTML基础(2)——边框的更多相关文章
- HTML&CSS基础-外边框
HTML&CSS基础-外边框 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.HTML <!DOCTYPE html> <html> <h ...
- HTML&CSS基础-内边框
HTML&CSS基础-内边框 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.HTML源代码 <!DOCTYPE html> <html> &l ...
- css3基础-选择器+边框与圆角+背景与渐变
Css3选择器相关: section > div直接子元素选择器 div + article相邻兄弟选择器(在元素之后出现) div ~ article通用兄弟选择器(在元素之后出现) 属性选择 ...
- 理解CSS边框border
前面的话 边框是CSS盒模型属性中默默无闻的一个普通属性,CSS3的到来,但得边框属性重新焕发了光彩.本文将详细介绍CSS边框 基础样式 边框是一条以空格分隔的集合样式,包括边框粗细(边框宽度 ...
- CSS基础知识(颜色、伪类、盒子模型)
6.设置颜色单位 L 普通英文单词 {color : 属性值red;} 此方法简单,便捷.但设置的颜色在不同浏览器中,可能显示的颜色出现差异 * 三原色 - 红.绿.蓝 L 颜色的八进制方式 ...
- 用CSS写气泡
新学到的一个小效果 用CSS实现如下图效果,其中demo结构为:<div id="square"></div> 实现这个效果需要用到两个知识点: 1.用bo ...
- CSS3基础(2)—— 文字与字体相关样式、盒子类型、背景与边框相关样式、变形处理、动画功能
一. CSS3 文字与字体相关样式 1. 给文字添加阴影 text-shadow: length length length ccolor; 属性适用于文本阴影,指定了水平阴影,垂直阴影,模糊的距离, ...
- CSS入门(css简介与样式汇总、CSS的使用方式和特征、CSS基础选择器和复杂选择器、边框阴影)
一.CSS的作用 1.以统一的方式实现样式的定义 2.提高页面样式的可重用性和可维护性 3.实现了内容(HTML)和表示(CSS)的分离 HTML和CSS之间有什么关系? HTML:构建网页的结构 C ...
- HTML&CSS基础-边框简写属性
HTML&CSS基础-边框简写属性 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.HTML源代码 <!DOCTYPE html> <html> ...
- CSS(五)- 背景与边框 - 边框圆角与阴影基础用法
扩展阅读 本文仅仅做border的基础使用,想要深入了解的话可以戳以下几个链接,觉得作者写的很好. CSS Backgrounds and Borders Module Level 3 CSS魔法堂: ...
随机推荐
- ArcGIS AddIN开发之 设置当前工具为Edit Tool
在GIS数据处理中,经常需要选择要素,再进行操作.所以,为了处理的方便,可以将当前工具处理结束后,将当前工具设置为Edit Tool,以方便下一次的选择处理. 相关资料: 1.ArcMap Name ...
- input属性为number时,如何去掉右边的 +、-号
修改css /* 谷歌 */ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearan ...
- Phpstorm 2018及2017.3.2激活码(DataGrip WebStorm 激活码)
PhpStrom的下载地址:https://www.jetbrains.com/phpstorm/ 2018适应 最新版PhpStorm 2018正式版改进了PHP 7支持,改进代码完成功能. 直接用 ...
- 序列&权限&索引&视图的语句
create sequence 订单_订单编号_seq -- 创建序列 (成功后在sequence中查询) increment by start with maxvalue nocycle nocac ...
- [07-01]http网页提示含义
出现较多的一些网页代码提示的意思: 100 - 继续. 101 - 切换协议. 110 重新启动标记答复. 120 服务已就绪,在 nnn 分钟后开始. 125 数据连接已打开,正在开始传输. 150 ...
- 好用的 over the wall教程
还在为翻 xxx墙苦恼吗,一分钟就能搞定的翻xxx墙教程 1.下载chrome扩展插件 Proxy SwitchyOmega,加入到谷歌的高级扩展程序当中,这个就不详细讲解了. 请戳 https:// ...
- websocket作用
1.即时通讯 web即时通讯(网页的QQ,聊天系统等)可以通过websocket实现. 2.轮询 web开发中,有时需要通过轮询(比如时间间隔5秒)去服务器读取数据. 使用HTTP协议向服务器发送re ...
- 11.0-uC/OS-III就绪列表(优先级)
准备运行的任务被放置于就绪列表中.就绪列表包括2个部分:位映像组包含了优先级信息,一个表包含了所有指向就绪任务的指针. 1.优先级 图6-1到6-3显示了优先级的位映像组.它的宽度取决于CPU_DAT ...
- CentOS下rpm命令详解
CentOS下rpm命令详解 rpm,Redhat Package Manager,即为红帽公司为RHEL开发的专用包管理器,后来更改为RPM Package Manager,类似于GNU项目,使用递 ...
- SimplifyReader项目(转载)
项目地址: https://github.com/SkillCollege/SimplifyReader SkillCollege / SimplifyReader 一款基于Google Materi ...