<div class='header'>
    <div class="header-left">
      <span class='iconfont back-icon'></span>
    </div>
    <div class="header-input">
      <span class="iconfont"></span>
      输入城市/景点/游玩主题
    </div>
      <div class="header-right">
        城市
        <span class='iconfont arrow-icon'></span>
      </div>
  </div>
  .header
    display:flex
    line-height:.86rem
    background:red
    color:#fff
    .header-left
      width:.64rem
      float:left
      .back-icon
        padding:.12rem
        text-align:center
        font-size :.4rem
    .header-input
      flex:1
      height:.68rem
      margin-top:.12rem
      margin-left:.2rem
      padding-left:.2rem
      background:#fff
      border-radius:.1rem
      color:#ccc
    .header-right
      min-width:1.04rem
      padding:0 .1rem
      float:right
      text-align:center
      color:#fff
      .arrow-icon
        margin-left:-.04rem
        font-size:.24rem

CSS之Header--我的头部我做主的更多相关文章

  1. apiCloud中实现头部与内容分离与操作规范，App头部header固定，头部与内容分离

    官方案例 1.头部拆分成一个页面比如news-text <!doctype html> <html> <head> <meta charset="u ...

  2. 天了噜，为什么外链css要放在头部，js要放在尾部？

    我们最开始学前端的时候都会看到教程在处理外部css,js的时候会将css放在header中,js放在body的最后.为什么要这样子处理,今天参考一些资料好好分析下. 为什么外链css为什么要放头部? ...

  3. CSS中position和header和overflow和background

    <!DOCTYPE html> <!--CSS中position属性--> <html lang="en"> <head> < ...

  4. 2. react 简书 头部(header) 图标添加

    1. 访问 iconfont 并注册 登陆 2. 进入 iconfont 头部 图标管理->我的项目 3. 点击右边的文件夹 + 号 图标 创建我的项目 输入项目名称即可 4.在 搜索框 搜索 ...

  5. PHP 常用的header头部定义汇总

    <?phpheader('HTTP/1.1 200 OK'); // ok 正常访问header('HTTP/1.1 404 Not Found'); //通知浏览器 页面不存在header(' ...

  6. Asp.Net网页头部动态加载标题、描述、关键字、css和js文件的方法

    首先head标签上添加runat="server". protected void Page_Load(object sender, EventArgs e) { Page.Tit ...

  7. 【转载】PHP 常用的header头部定义汇总

    header() 函数向客户端发送原始的 HTTP 报头. 认识到一点很重要,即必须在任何实际的输出被发送之前调用 header() 函数(在 PHP 4 以及更高的版本中,您可以使用输出缓存来解决此 ...

  8. CSS知识总结（一）

    一.认识CSS 1.什么是CSS? CSS (Cascading Style Sheet) 层叠样式表 是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言. 由于CSS属性或规则尚未成为 ...

  9. 深入理解css中position属性及z-index属性

    深入理解css中position属性及z-index属性 在网页设计中,position属性的使用是非常重要的.有时如果不能认识清楚这个属性,将会给我们带来很多意想不到的困难. position属性共 ...

随机推荐

  1. AutoCAD.net支持后台线程-Socket通讯

    最近因为公司项目的需求,CAD作为服务端在服务器中常驻运行,等待客户端远程发送执行任务的指令,最终确认用Socket-tcp通讯,CAD需要实时监听客户端发送的消息,这时就需要开启线程执行Socket ...

  2. Python 在子类中调用父类方法详解（单继承、多层继承、多重继承）

    Python 在子类中调用父类方法详解(单继承.多层继承.多重继承)   by:授客 QQ:1033553122   测试环境: win7 64位 Python版本:Python 3.3.5 代码实践 ...

  3. 华Xia相机WEB后台设置

    1:设备维护->设备信息:出入口类型:入口2:更多参数->屏显参数:屏显协议18 3:更多参数->外设参数:RS581-1 串口使能勾上 串口工作模式 屏显控制 96004:更多参数 ...

  4. Django from表单及ajax提交文件

    参考: https://blog.csdn.net/baobao267/article/details/83038323

  5. 【Python】pydot安装失败解决方法

    使用keras时输出网络结构需要用到pydot,总是安装失败,最后按照下面这样的步骤成功了. 1.安装graphviz:pip install graphviz 2.安装graphviz软件,地址在: ...

  6. python实现简单的负载均衡

    提到分发请求,相信大多数人首先会想到Nginx,Nginx作为一种多功能服务器,不仅提供了反向代理隐藏主机ip的能力,还拥有简单的缓存加速功能.当然Nginx最强大的功能还是分发请求,不仅提供了哈希, ...

  7. HDFS ErasureCode方案对比

    HDFS目前存储文件的方案是将一个文件切分成多个Block进行存储,通常一个Block 64MB或者128MB,每个Block有多个副本(replica),每个副本作为一个整体存储在一个DataNod ...

  8. 使用 Azure 门户创建 Windows 虚拟机

    可以通过 Azure 门户创建 Azure 虚拟机. 此方法提供一个基于浏览器的用户界面,用于创建和配置虚拟机和所有相关的资源. 本快速入门介绍了如何创建虚拟机并在 VM 上安装 webserver. ...

  9. [SQLSERVER] 把TransactionLog截断

    注意:以下语句非常危险 --BACKUP LOG MyDb TO DISK=’NUL:’

  10. CSS| table property