border

border-top设置上边界
border-bottom / border-left / border-right 同理
可以为每一条边设置 :
  • border-top-width宽度
  • border-top-style类型:solid实线 dashed虚线 dotted点线 double双下划线 groove ridge inset outset
  • border-top-color 颜色
也可以用简写:
border: 3px solid black;
 

圆角

使用border-radius属性设置,可以使用两个 长度 / 百分比 作为值:第一个定义水平半径,第二个定义垂直半径。
若只传递一个值,那么该值重复使用。
 
若要单独设置一个角,可以用 border-top-right-radius的形式。
 
 

CSS基础-边框的更多相关文章

  1. HTML&CSS基础-边框简写属性

    HTML&CSS基础-边框简写属性 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.HTML源代码 <!DOCTYPE html> <html> ...

  2. CSS入门(css简介与样式汇总、CSS的使用方式和特征、CSS基础选择器和复杂选择器、边框阴影)

    一.CSS的作用 1.以统一的方式实现样式的定义 2.提高页面样式的可重用性和可维护性 3.实现了内容(HTML)和表示(CSS)的分离 HTML和CSS之间有什么关系? HTML:构建网页的结构 C ...

  3. HTML&CSS基础-外边框

    HTML&CSS基础-外边框  作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.HTML <!DOCTYPE html> <html> <h ...

  4. HTML&CSS基础-内边框

    HTML&CSS基础-内边框  作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.HTML源代码 <!DOCTYPE html> <html> &l ...

  5. 前端开发:css基础知识之盒模型以及浮动布局。

    前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西?  为什么这个浮动没有效果?  这个问题楼主已经回答了n遍.今天则是把 ...

  6. 妙味课堂——HTML+CSS基础笔记

    妙味课堂的课程讲得非常的清楚,受益匪浅.先把HTML和CSS基础课程部分视频的学习笔记记录如下: padding #PS基础 ##前端需要的PS技能 - PS技能(前端需要):切图.修图.测量 - P ...

  7. WEB前端开发CSS基础样式全面总结

    Web前端开发css基础样式全面总结 颜色和单位的使用 颜色 用颜色的名字表示颜色,比如:red 用16进制表示演示 比如:#FF0000 用rgb数值表示颜色,rgb(红,绿,蓝),每个值都在0-2 ...

  8. CSS基础知识之float

    前段时间写过一篇CSS基础知识之position,当时对float的理解不太准确,被慕课网多名读者指出(原文已修正,如有误导实在抱歉).现对float进行更深入的学习,在此把学习心得分享给大家. 浮动 ...

  9. (转)第一天 XHTML CSS基础知识 文章出处:标准之路(http://www.aa25.cn/div_css/902.shtml)

    欢迎大家学习<十天学会web标准>,也就是我们常说的DIV+CSS.不过这里的DIV+CSS是一种错误的叫法,建议大家还是称之为web标准. 学习本系列教程需有一定html和css基础,也 ...

随机推荐

  1. html中创建并调用vue组件的几种方法

    最近在写项目的时候,总是遇到在html中使用vue.js的情况,且页面逻辑较多,之前的项目经验都是使用脚手架等已有的项目架构,使用.vue文件完成组价注册,及组件之间的调用,还没有过在html中创建组 ...

  2. mysql之分区表

    1.分区表概述: 1.分区表的主要意义在于,对于表结构进行划分,不同的数据进入不同的分区中,以便于在查询过程中,只查找指定分区的数据,减少数据库扫描的数据量. 2.虽然从逻辑上看分区表是一张表,但是底 ...

  3. Python_pycharm调试模式+使用pycharm给python传递参数

    一.通过pycharm 给python传递函数 1. 在pycharm终端中写入要获取的参数,进行获取 1>启动pycharm 中Terminal(终端) 窗口 点击pycharm左下角的图标, ...

  4. 2020年最新ZooKeeper面试题(附答案)

    2020年最新ZooKeeper面试题 1. ZooKeeper 是什么? ZooKeeper 是一个开源的分布式协调服务.它是一个为分布式应用提供一致性服务的软件,分布式应用程序可以基于 Zooke ...

  5. Nginx 解析漏洞复现

    一.漏洞描述 该漏洞与nginx.php版本无关,属于用户配置不当造成的解析漏洞 二.漏洞原理 1.由于nginx.conf的如下配置导致nginx把以'.php'结尾的文件交给fastcgi处理,为 ...

  6. 博客新域名www.tecchen.tech

    新年祝福 祝新的一年,大朋友实现所有梦想,小朋友健康成长- 新域名 https://www.tecchen.tech 有效期:10年 旧链接 之前的链接请自行替换为新链接地址,包括但不限于以下二级域名 ...

  7. netsniff使用

    1 netsniff安装与使用 首先直接下载源码包进行部署 安装一些前置包(安装完成的自动忽略) sudo apt install pkg-config sudo apt install libcli ...

  8. Guitar Pro教程之组织小节

    上一章节我们讲述了关于Guitar Pro 7的主界面的相关功能的介绍,对于初学作曲,又是吉他的初学者,刚刚接触{cms_selflink page='index' text='Guitar Pro' ...

  9. 怎么用在线思维导图Ayoa规划个人任务

    在Ayoa的任务板功能中可以对某一任务进行详细设置,例如改变紧急情况/重要程度.添加到我的计划工具.设置开始日期.截止日期等. 图1:任务详情设置 而这里的"我的计划工具"就是一个 ...

  10. 如何利用FL Studio进行音乐合并

    FL Studio20是Fruity Loops Studio的简称,也叫做水果音乐制作软件.它是一款功能十分强大的音乐制作软件,将作曲.编曲.混音.录音.大碟等功能集合一体,外接MIDI即可成为一个 ...