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 ...
随机推荐
- Nacos 学习资料
资料 网址 官方网站 https://nacos.io/zh-cn/docs/what-is-nacos.html github https://github.com/alibaba/nacos 程序 ...
- scapy 中sniff指定的数据包并打印指定信息
在理解这篇文章前可以先看看这两篇文章: https://www.cnblogs.com/liyuanhong/p/10925582.html https://www.cnblogs.com/liyua ...
- ActiveMQ 入门和与 Spring 整合
ActiveMQ 入门演示 activemq 依赖 <dependency> <groupId>org.apache.activemq</groupId> < ...
- mysql 之编码配置、引擎介绍、字段操作、数据类型及约束条件
数据库的配置 # 通过配置文件统一配置的目的: 统一管理 服务端(mysqld) 客户端(client) 配置了mysqld(服务端)的编码为utf8, 那么再创建的数据库,默认编码都采用utf8. ...
- limits the number of elements in an IN predicate to 2100 entries.
org.hibernate.engine.jdbc.spi.SqlExceptionHelper 131 - [TxId : f68db5f5b-qmgnc^1561639897640^271530 ...
- Linux中关于samba的几个问题
一.用smbclient命令登录成功但看不了文件 原因:SELinux的阻挡 解决:1.关闭SELinux : setenforce 0 (临时生效,重启后失效) 或vi /etc/sysco ...
- 请用js写一个函数,实现获取浏览器url中查询字符串中的参数并返回一个数组
<script> console.log(getUrlArr()); function getUrlArr() { var arr = []; var url = "http:/ ...
- 洛谷 P3368 【模板】树状数组 2 题解
P3368 [模板]树状数组 2 题目描述 如题,已知一个数列,你需要进行下面两种操作: 1.将某区间每一个数数加上x 2.求出某一个数的值 输入格式 第一行包含两个整数N.M,分别表示该数列数字的个 ...
- mysql 数据库中的每张表加同一个字段(避免重复加)
DROP PROCEDURE IF EXISTS testEndHandle; DELIMITER $$ CREATE PROCEDURE testEndHandle() BEGIN DECLARE ...
- No module named 'paddle.fluid'
问题 win10笔记本,安装了paddlepadde,但是仍然报错,No module named 'paddle.fluid'. 解决 在py文件中,我先下载并且引入了paddle,后来又安装.引入 ...