<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <style>

        p{

            margin: 0;

            padding: 0;

        } //清除p标签默认的间隔，或者将p标签换成div标签

        body{

            background-color: #f5f5f5;

        }

        .box{

            width: 234px;

            height: 300px;

            background-color: #ffff;

            /* background-color:blue; */

            text-align: center;

            margin: 0 auto;

        }

        img{

            width: 160px;

        }

        .product {

            height: 25px; //文字顶部到下一行文字的高度

            font-size: 14px;

        }

        .info {

            font-size: 12px;

            height: 30px;

            color: #cccccc;

        }

        .price{

            font-size: 14px;

            color: #ffa500;

        }

    </style>

</head>

<body>

    <div class="box">

        <img src="./images/car.jpg" alt="平衡车">

        <p class="product">九号平衡车</p>

        <p class="info">成人的玩具</p>

        <p class="price">1999元</p>

    </div>

</body>

</html>

　　

css 文本基础 实战 小米官方卡片案例的更多相关文章

  1. 图片与文本基础（html和css）

    图片与文本基础 -----注释添加可以用/**/ 5.1图片 1.gif图片:最大颜色数256,保存时采用无损压缩 2.JPEG图片:可以包含1670万种颜色,保存时采用有损压缩,压缩率小的质量更高. ...

  2. css基础-css选择器和css文本样式相关

    css基础-css选择器和css文本样式相关: 使用link链入外部样式,页面加载时会同时加载样式 @import url(“*.css”);使用导入式,页面加载完后,才会加载样式 链接伪类的顺序 : ...

  3. HTML+CSS提升小实战

    1 <html> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html ...

  4. 2天驾驭DIV+CSS （基础篇）（转）

    这是去年看到的一片文章,感觉在我的学习中,有不少的影响.于是把它分享给想很快了解css的兄弟们. 基础篇[知识一] “DIV+CSS” 的叫法是不准确的[知识二] “DIV+CSS” 将你引入两大误区 ...

  5. MySQL的初次见面礼基础实战篇

    [版权申明] http://blog.csdn.net/javazejian/article/details/61614366 出自[zejian的博客] 关联文章: MySQL的初次见面礼基础实战篇 ...

  6. 3.CSS使用基础(2)

    目录 一.CSS 链接 二.CSS 列表样式(ul) 三.CSS Table(表格) 四.盒子模型 五.CSS Border(边框) 六.CSS 轮廓(outline)属性 七.CSS Margin( ...

  7. 前端工程师面试问题归纳（一、问答类html/css/js基础）

    一.参考资源 1.前端面试题及答案整理(一) 2.2017年前端面试题整理汇总100题 3.2018最新Web前端经典面试试题及答案 4.[javascript常见面试题]常见前端面试题及答案 5.W ...

  8. CSS 文本字体颜色设置方法(CSS color)

    CSS 文本字体颜色设置方法(CSS color) 一.认识CSS 颜色(CSS color) 这里要介绍的是网页设置颜色包含有哪些:网页颜色规定规范. 1.常用颜色地方包含:字体颜色.超链接颜色.网 ...

  9. CSS高效开发实战:CSS 3、LESS、SASS、Bootstrap、Foundation --读书笔记（1）设定背景图

    技术的新发展,除计算机可以接入互联网之外,平板电脑.智能手机.智能电视等其他设备均可访问互联网.在多设备时代,构建多屏体验也不是听说的那么难. 但是这也增加了学习CSS的难度?不知道如何上手,只懂一点 ...

随机推荐

  1. 阿里云esc 登录时的相关提示

    1. 如果该ecs 未绑定密钥对,可以通过常规的用户名密码登录 2. 如果该 ecs 绑定了密钥对,则需要通过私钥进行登录 3. 如果使用 比如 securityCRT 登录时报 " A p ...

  2. CDN服务的含义

    CDN的全称是Content Delivery Network,即内容分发网络.CDN的基本原理是广泛采用各种缓存服务器,将这些缓存服务器分布到用户访问相对集中的地区或网络中,在用户访问网站时,利用全 ...

  3. @Deprecated注解功能

    @Deprecated注解功能 标记不建议使用的方法,但是仍然可以用 当方法有更好的方法替换时,但是此方法还有使用时可以使用该注解

  4. 使用OPC与PLC通讯 一

    总结自己在opc与自控开发的经验.首先介绍OPC DA模式下的OPC各种操作. 在使用opc时需要引用到 OPCDAAuto.dll 这个类库. 在项目引用后需要注册这个类库,否则程序跑起来会报错,& ...

  5. Tableau如何绘制多边形地图

    一.把省\自治区拖拽至标记生成地图二.把销售额拖拽至标记 三.地图-地图层-冲蚀100% 四.最终结果如图所示

  6. HMAC在“挑战/响应”（Challenge/Response）身份认证的应用

    HMAC的一个典型应用是用在"挑战/响应"(Challenge/Response)身份认证中. 认证流程 (1) 先由客户端向服务器发出一个验证请求. (2) 服务器接到此请求后生 ...

  7. Swagger如何匹配多个Controller类或者目录

    方法一(最普通的方式):匹配一个controller目录下的所有controller类. 1 @Bean 2 public Docket creatRestApi(){ 3 return new Do ...

  8. CF1454A Special Permutation 题解

    Content 给定一个整数 \(n\),请构造出一个长度为 \(n\) 的排列 \(\{a_i\}_{i=1}^n\),使得对于每个 \(a_i\),都有 \(a_i\neq i\). 我们称一个长 ...

  9. Nginx中配置反向代理的proxy_pass的不同斜杠的区别

    location /api1/ { proxy_pass http://localhost:8080; } # http://localhost/api1/xxx -> http://local ...

  10. linux(centos)系统安装activemq

    activemq是消息中间件,可以用来 解耦.消峰.异步 需要先安装jdk环境:https://www.cnblogs.com/pxblog/p/10512886.html 1.下载文件 (也可以直接 ...