css 四周边框角加粗效果
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
div {
position: relative;
left: 50px;
top: 50px;
margin: 10px;
width: 500px;
height: 100px;
border: 1px solid #E3581D;
} .border {
position: absolute;
padding: 5px;
border-style: solid;
border-color: #E3581D;
} .row1 {
border-width: 5px 0 0 5px;
top: -5px;
left: -5px;
border-radius: 4px 0 0 0;
} .row2 {
border-width: 5px 5px 0 0;
top: -5px;
right: -5px;
} .col1 {
border-width: 0 0 5px 5px;
bottom: -5px;
left: -5px;
} .col2 {
border-width: 0 5px 5px 0;
bottom: -5px;
right: -5px;
}
</style>
</head> <body>
<div>
<span class="border row1"></span>
<span class="border row2"></span>
<span class="border col1"></span>
<span class="border col2"></span>
</div>
</body> </html>
css 四周边框角加粗效果的更多相关文章
- NGUI的字体加粗效果
ngui的UILabel可以通过属性面板(inspector)设置字体的样式:加粗 倾斜 正常等. 但是如果通过这里设置了加粗,与实际的加粗不一样,ngui有一个拉伸宽度的变化. 这让人觉得很丑 .如 ...
- 运用CSS高斯模糊添加图片加载效果
<!DOCTYPE html> <html> <head> <title>大图片加载从模糊到清晰</title> </head> ...
- CSS 奇技淫巧 | 巧妙实现文字二次加粗再加边框
本文将通过一个实际的业务需求,讲解如何实现 极端场景下文字加粗加边框效果 文字多重边框的效果 需求背景 - 文字的二次加粗 今天遇到这样一个有意思的问题: 在文字展示的时候,利用了 font-weig ...
- word中几个好用的宏代码（立方米上标、关闭样式自动更新、删除无效样式、表格加粗边框、宋体引号）
Sub 替换立方米() With Selection.Find .Text = "m3" .Replacement.Text = "mm3" .Forward ...
- html字体加粗标签与写法
在html中字体加粗的标签为<b>标签,当我们使用了该标签,字体就会加粗,一般用于注明重要信息,强调文字上面写法如下 字体加粗:<b>这里的字体就会加粗</b> 效 ...
- jquery 页面加载效果
30个jquery 页面加载效果 30个jquery 页面加载效果 30 CSS Page Preload Animations 加载效果列表 Square Animations Demo 1 ...
- CSS鼠标悬停图片加边框效果，页面布局发生错位的解决办法
CSS鼠标悬停图片加边框效果,页面布局发生错位的解决办法 .recomend-list{ width:1200px; a{ @extend %fl; margin-right: 30px; width ...
- CSS发光边框文本框效果
7,166 次阅读 ‹ NSH Blog 网页设计 CSS发光边框文本框效果 或许你看过Safari浏览器下,任何输入框都会有一个发光的蓝色边框,这不单纯只是蓝色边框而已,其实包含了许多CSS3技巧知 ...
- php原生PHPExcel插件导表（附表格合并，加粗居中及加边框换行操作）
PHPExcel是用来操作Office Excel文档的一个PHP类库,它基于微软的OpenXML标准和PHP语言.可以使用它来读取.写入不同格式的电子表格,如 Excel(BIFF) .xls, E ...
随机推荐
- jsp 增删改查
使用Idea创建项目 1.新建web application项目 Idea 选择 Java Enterprise -> web application 2.新版本没有web-inf文件夹 解决方 ...
- String的charAt(int index)可用于遍历一个字符串的所有字符
charAt(int index)遍历一个字符串的所有字符实例 String name = "Whatisjava?"; for (int i = 0; i < name.l ...
- 使用EHCache需要注意的几个问题(转)
最近做一个小项目,需要对一批数据进行缓存,且要求持久化到磁盘.使用ehcache非常简单和直观,一般来说只需要配置ehcache.xml文件,接着直接使用@Cacheable, @Cacheput, ...
- CUDA编程模型之内存管理
CUDA编程模型假设系统是由一个主机和一个设备组成的,而且各自拥有独立的内存. 主机:CPU及其内存(主机内存),主机内存中的变量名以h_为前缀,主机代码按照ANSI C标准进行编写 设备:GPU及其 ...
- 用nginx缓存静态文件
这篇教程说明你应该怎样配置 nginx.设置 HTTP 头部过期时间,用 Cache-Control 中的 max-age 标记为静态文件(比如图片. CSS 和 Javascript 文件) ...
- 三. 200多万元得到的创业教训--创业并不需要app
摘要:有个点子,研发app或网站,推广,不断改进,探索盈利模式.这个通用的移动互联网创业流程.但我认为,在某些特定的商业模式下,"研发app或网站"这步可以砍掉或推迟. 健生干货分 ...
- VM10虚拟机安装图解
支持32位windows操作系统和64位操作系统的VM10虚拟机 ============= 下载虚拟机: VM10虚拟机下载网址+Vm10的激活秘钥 https://jingyan.baidu.c ...
- Python 下载win32api 模块
终端输入 pip install pypiwin32
- Python爬虫三年没入门，传授一下绝世神功，经理唏嘘不已！
长期枯燥的生活,敲代码的时间三天两头往吸烟室跑,被项目经理抓去训话. "入门"是学习Python最重要的阶段,虽然这个过程也许会非常缓慢.当你心里有一个目标时,那么你学习起来就不会 ...
- indexer_worker.go
package) ) ) ) { request.rankerReturnChannel <- rankerReturnRequest{} con ...