<!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. 【编程思想】【设计模式】【结构模式Structural】front_controller

    Python版 https://github.com/faif/python-patterns/blob/master/structural/front_controller.py #!/usr/bi ...

  2. CountDownLatch原理

    正如每个Java文档所描述的那样,CountDownLatch是一个同步工具类,它允许一个或多个线程一直等待,直到其他线程的操作执行完后再执行.在Java并发中,countdownlatch的概念是一 ...

  3. 基于阿里云 ecs 使用 docker 方式部署 showDoc

    官网文档:https://www.showdoc.cc/help?page_id=65610 (建议先看下这个) 首先说明一下,我 ecs 镜像是 CentOS 7.6 64位 1. 首先在 服务器上 ...

  4. contrller层的编码设设计流程以及详细配置

    /**      实际开发中遵循一个规律:自己写的类使用注解,系统提供的类使用配置文件 1.书写controller类----->配置springmvc.xml-------->配置web ...

  5. 匿名内部类与lamda表达式

    1.为什么要使用lamda表达式 从JDK1.8开始为了简化使用者进行代码开发,专门提供有Lambda表达式的支持,利用此操作形式可以实现函数式的编程,对于函数式编程比较著名的语言:haskell,S ...

  6. 分布式全局ID生成器原理剖析及非常齐全开源方案应用示例

    为何需要分布式ID生成器 **本人博客网站 **IT小神 www.itxiaoshen.com **拿我们系统常用Mysql数据库来说,在之前的单体架构基本是单库结构,每个业务表的ID一般从1增,通过 ...

  7. JavaScript对象之面向对象

    在js中创建对象的两种方式 1.new一个Objecteg: var flower = new Object(); flower.stuname = "呵呵"; flower.ag ...

  8. N1BOOK——[第五章 CTF之RE章]wp

    推荐在了解了相应章节的内容后再来练习,你会觉得顿时悟了 记录一下自己的解题过程 2,3,4题目附件来源:https://book.nu1l.com/tasks/#/pages/reverse/5.4 ...

  9. 当更新user表时,页面没有的属性,执行update语句不会更改以前的值

    当更新user表时,页面没有的属性,执行update语句不会更改数据库表的值.不会用NULL值去填充

  10. winpcap 静默安装

    前几天做一个小工具用到winpcap,由于有些用户系统未必安装过这个而领导要求尽量减少用户点击,于是只好想办法静默安装了,csdn搜了,貌似没有好用的,求助stackoverflow,还好,在某篇解答 ...