python day 22 CSS拾遗之箭头,目录,图标
day 4 learn html
2019/11/14
学习资料来自老男孩与尚学堂
1. CSS拾遗之图标
图标有三种制作方法:
- 图片
- css(小箭头用CSS搞定)
- 自己画font(fontawsome插件)
fontawsome插件下载之后,解压,新版的与老版不一样。
2. html文件的目录结构
xxx project
- app
- s1.html
- s2.html
- css
- commons.css
- script
- commons.js
- plugin
- fontawsome
- bootstrap
- ...
3. CSS拾遗之a包含标签
image默认是有个边框的,在chrom中没事,但是在IE Browser里面就会把边框显示出来,所以要将image标签的边框设为0.
<hedad>
<style>
img{
border: 0;
}
/* IE浏览器会产生边框,所以要将边框设为0 */
</style>
</head>
<body>
<a href="wwww.baidu.com">lanxing</a>
<a href="www.baidu.com">
<img sytle="height:300px;width:400px" src="wallpaper1.jpg" alt="lanxing">
<a>
<body>
4. CSS拾遗之箭头画法
<style>
.up {
border-top: 30px solid green;
border-right: 30px solid transparent;
border-bottom: 30px solid transparent;
border-left: 30px solid transparent;
display: inline-block;
}
.down {
border-top: 30px solid transparent;
border-right: 30px solid transparent;
border-bottom: 30px solid red;
border-left: 30px solid transparent;
display: inline-block;
}
.c1 {
border: 30px solid transparent;
border-top: 30px solid green;
display: inline-block;
margin-top: 40px;
}
.c1:hover {
border: 30px solid transparent;
border-bottom: 30px solid green;
margin-top: 10px;
}
</style>
</head>
<body>
<div class="up"></div>
<div class="down"></div>
<div style="height: 100px; background-color: red;">
<div class="c1"></div>
</div>
</body>
python day 22 CSS拾遗之箭头,目录,图标的更多相关文章
- CSS快速入门-箭头和图标
一.三步搞懂箭头产生的原理 在前面的盒子模型一文中,我们已经知道了一个元素空间占位.为了弄明白箭头的产生,我们可以三步走: #demo12 { border: 100px solid; border- ...
- Python开发【第一篇】:目录
本系列博文包含 Python基础.前端开发.Web框架.缓存以及队列等,希望可以给正在学习编程的童鞋提供一点帮助!!! Python开发[第一篇]:目录 Python开发[第二篇]:初识Python ...
- Python基于Python实现批量上传文件或目录到不同的Linux服务器
基于Python实现批量上传文件或目录到不同的Linux服务器 by:授客 QQ:1033553122 实现功能 1 测试环境 1 使用方法 1 1. 编辑配置文件conf/rootpath_fo ...
- 【Python全栈-CSS】CSS入门
CSS入门教程 参考: http://www.cnblogs.com/yuanchenqi/articles/5977825.html http://www.ruanyifeng.com/blog/2 ...
- 使用纯CSS实现带箭头的提示框
爱编程爱分享,原创文章,转载请注明出处,谢谢!http://www.cnblogs.com/fozero/p/6187323.html 1.全部代码 <!DOCTYPE html> < ...
- lib/sqlalchemy/cextension/processors.c:10:20: 致命错误: Python.h:没有那个文件或目录
本文地址:http://www.cnblogs.com/yhLinux/p/4063444.html $ sudo easy_install sqlalchemy [sudo] password fo ...
- css实现带箭头选项卡
这阵子在做一个web端项目中遇到一个问题,需要实现带箭头的选项卡点击可切换.起初没想太多,直接切一个向上的小箭头图片,外层div设置相同颜色的边框,再用相对定位和绝对定位.这种方法是可行的,但是因为手 ...
- 致命错误: Python.h:没有那个文件或目录
In file included from greenlet.c:5:0: greenlet.h:8:20: 致命错误: Python.h:没有那个文件或目录 编译中断. error: Setup s ...
- 使用css画一个箭头
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...
随机推荐
- AcWing 38. 二叉树的镜像
习题地址 https://www.acwing.com/solution/acwing/content/2922/ 题目描述输入一个二叉树,将它变换为它的镜像. 样例 输入树: / \ / \ / \ ...
- nginx proxy_pass 指令
nginx proxy_pass 指令 文档 Nginx 官方文档 https://nginx.org/en/docs/http/ngx_http_proxy_module.html#proxy_pa ...
- LA2955 Vivian难题——梅森素数
题意 输入 $k$(1 \leq k \leq 100)个正整数 $p_1, p_2, ..., p_k$(1 < p_i < 2{31}),找出 $k$ 个非负整数 $e_i$ 使得 $ ...
- Pandas | 14 统计函数
统计方法有助于理解和分析数据的行为.可以将这些统计函数应用到Pandas的对象上. pct_change()函数 系列,DatFrames和Panel都有pct_change()函数.此函数将每个元素 ...
- Windbg Processes and Threads(进程和线程)窗口的使用
在 WinDbg 中,进程和线程窗口中显示有关系统. 进程和线程正在调试的信息. 此窗口还可选择新的系统. 进程和线程处于活动状态. 如何打开进程和线程窗口 通过菜单View--->Proces ...
- 【线段树】【P4062】 [Code+#1]Yazid 的新生舞会
Description 给定一个长度为 \(n\) 的序列,求有多少子区间满足区间众数严格大于区间长度的一半.如果区间有多个出现次数最多且不同的数则取较小的数为众数. Limitation 对于全部的 ...
- Codeforces Round 558(Div 2)题解
这场比赛没有打,后来和同学们一起开了场镜像打…… B是SB题结果WA了5发…… C是SB题结果差5min调出……虽然中间有个老师讲题吃掉了1h D是比较神仙的题(2200),但是做出来了?算是比较超常 ...
- 趣谈Linux操作系统学习笔记:第二十七讲
一.文件系统的功能规划 1.引子 咱们花了这么长的时间,规划了会议室管理系统,这样多个项目执行的时候,隔离性可以得到保证. 但是,会议室里面被回收,会议室里面的资料就丢失了.有一些资料我们希望项目结束 ...
- 每日一问:不一样的角度吐槽下 DataBinding
我们项目采用的是 kotlin && DataBinding 处理的,可能你会疑问,既然用的是 kotlin,为啥没有用 kotlinx?新的页面当然是用的 kotlinx 啦,但我们 ...
- mac系统中怎么打开rar/zip等压缩文件?
平常使用mac的同学们,可能经常要接受下别人发过来的rar文件,可惜的时mac os x系统默认是不能打开rar文件(不知道以后苹果会支持rar不?),那么我们该如何去解圧rar文件,接下来我将介绍. ...