<!DOCTYPE html">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>网页</title>
    <style type="text/css">
        /*存放元素的区域*/
        html,body{
                    height:100%;
                }
        .content{/*存放元素的区域*/
        position:relative;
        width:200px;
        height:200px;
        background-color: #368;

        margin:auto;

        }

        .love{
        position:relative;
            width:200px;
            height:180px;
            background: silver;
        }

        .love .left{
        position:absolute;
        left:32px;
            width:100px;
            height:150px;
            background: red;
            border-radius:50px 50px 0 0;
            /* 对应的长度 得出弧度*/
            transform:rotate(-45deg);/*css3 形变,逆时针旋转45度*/

        }

            .love .right{
        position:absolute;
        left:68px;
            width:100px;
            height:150px;
            background: red;
            border-radius:50px 50px 0 0;
            /* 对应的长度 得出弧度*/
            transform:rotate(45deg);/*css3 形变,逆时针旋转45度*/
        }
        .love .left,.love .right{

        }

    </style>
</head>
<body>
    <!--  -->
        <div class='content'>
            <div class='love'>
                <div class='left'></div>
                <div class='right'></div>
            </div>
        </div>

</body>
</html>

使用html画爱心的更多相关文章

  1. 程序员式优雅表白,教你用python代码画爱心

    还能用python代码画爱心?还有这种操作?这是什么原理? 不相信python代码可以画爱心?先来一张效果图来看看效果吧! 用python代码画爱心的思路是怎样的? 1.怎么画心形曲线 2.怎么填满心 ...

  2. 一步一步教你用CSS画爱心

    今天小颖给大家分享一个用CSS画的爱心,底下有代码和制作过程,希望对大家有所帮助. 第一步: 先画一个正方形.如图: <!DOCTYPE html> <html> <he ...

  3. 利用snowfall.jquery.js实现爱心满屏飞

    小颖在上一篇一步一步教你用CSS画爱心中已经分享一种画爱心的方法,这次再分享一种方法用css画爱心,并利用snowfall.jquery.js实现爱心满屏飞的效果. 第一步: 利用伪元素before和 ...

  4. 用C语言制作爱心

    国庆我们实验室布置了作业,其中一项为,利用流程控制语句打印以下图形 * *** ***** ******* ***** *** * 代码如下 #include <stdio.h> int ...

  5. java swing画图片爱心

    第一次用swing做一个可视化程序,写第一篇随笔,有写的不好的地方请多多见谅.上个星期三在网上看到一个画爱心的软件,就想着自己用java也实现一个程序,画爱心用到的数学函数知识在网上百度的,不是本人原 ...

  6. 这个七夕节,用Python为女友绘制一张爱心照片墙吧!【华为云技术分享】

    欢迎添加华为云小助手微信(微信号:HWCloud002 或 HWCloud003),输入关键字“加群”,加入华为云线上技术讨论群:输入关键字“最新活动”,获取华为云最新特惠促销.华为云诸多技术大咖.特 ...

  7. 【Python】画一个心形

    #!/usr/bin/env python # -*- coding:utf-8 -*- import turtle import time # 画心形圆弧 def hart_arc(): for i ...

  8. python画一颗拳头大的💗

    用上turtle库后,各种画,今天画个拳头大的爱心@.@. 下面贴下代码: # -*- coding: utf-8 -*- # Nola import pygame import time impor ...

  9. 爱心跳动效果 CSS实现

    爱心跳动效果 CSS实现 实现效果 砰砰砰 实现原理 通过动画改变每个元素的高度,从而实现每个元素高度变化的效果,为了使每个元素依次跳动,给每个元素添加一定的延时效果,使得从效果元素依次跳动 代码分析 ...

随机推荐

  1. Rabbitmq与spring整合之重要组件介绍——AMQP声明式配置&RabbitTemplate组件

    上一节是使用rabbitAdmin的管理组件进行声明队列,交换器,绑定等操作,本节则是采用AMQP声明式配置来声明这些东西.AMQP声明主要是通过@Bean注解进行的. 配置: package com ...

  2. 154. 寻找旋转排序数组中的最小值 II

    转跳点:--\(˙<>˙)/-- 原本打算大年三十十一起写完的,结果这篇拖到了年初一…… 这道题比刚刚那道,麻烦一点,因为有重复,所以我们需要考虑重复的情况,就是刚刚的两种情况变成了三种: ...

  3. 统计返回的Decimal/long型数据转换问题

    mysql数据库在进行统计时候,返回的count()是个long型,sum()返回的是bigDecimal类型,前段需要的是int型故而需要进行转换. <select id="getD ...

  4. 【LeetCode】合并两个有序数组

    [问题] 给定两个有序整数数组 nums1 和 nums2,将 nums2 合并到 nums1 中,使得 num1 成为一个有序数组. 说明:初始化 nums1 和 nums2 的元素数量分别为 m ...

  5. Python基础笔记:函数:调用函数、定义函数、函数的参数、递归函数

    一.定义一个求二元一次方程的根的函数 #Sublime Text import math def ee(a,b,c): delta=b*b-4*a*c if delta<0: return 'n ...

  6. pandas中na_values与keep_default_na

    我们在使用pandas读取文件时,常会遇到某个字段为NaN. 一般情况下,这时因为文件中包含空值导致的,因为pandas默认会将 '-1.#IND', '1.#QNAN', '1.#IND', '-1 ...

  7. 三十四、在SAP的屏幕选择中,将英文替换成我们想要的文本内容

    一.我们在代码中定义了一个选择屏幕,但是对应的显示界面为英文 界面如下 二.我们选择[转到]-[文本元素] 三.默认的文本内容是问号和三个点 四.我们修改成我们需要的,并激活这个文本,如果不激活会丢失 ...

  8. ServletConfig详解

    ServletConfig是Servlet中的init()方法的参数类型,服务器会在调用init()方法时传递ServletConfig对象给init()方法.   ServletConfig对象封装 ...

  9. enlipse 快捷键

    ctrl+shift+o  去掉多余的引用类

  10. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 字体图标(Glyphicons):glyphicon glyphicon-camera

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...