[外链图片转存失败(img-vXBQK5k4-1564155857781)(https://upload-images.jianshu.io/upload_images/11158618-ceccffd934c3e31d.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

元素的分类

css的diaplay属性

背景图片

[外链图片转存失败(img-Qx0JKogR-1564155857783)(https://upload-images.jianshu.io/upload_images/11158618-d671282806826434.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-4u8inOV2-1564155857784)(https://upload-images.jianshu.io/upload_images/11158618-4d669ae2cc37deae.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-573bEily-1564155857787)(https://upload-images.jianshu.io/upload_images/11158618-bce7b603e08d73fe.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-iNX4k1Qj-1564155857796)(https://upload-images.jianshu.io/upload_images/11158618-c3c518ecbcd36435.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-ugoQA4sc-1564155857798)(https://upload-images.jianshu.io/upload_images/11158618-e59930b707c994ae.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-Pm9fmXkf-1564155857801)(https://upload-images.jianshu.io/upload_images/11158618-64c54774c4333b98.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-zwCOjogm-1564155857803)(https://upload-images.jianshu.io/upload_images/11158618-9faf656ed93bac64.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS的display属性</title>
<style>
*{
padding:0;
margin:0;
}
a{
/*此处填写代码*/
display: block;
width: 200px;
height: 200px;
background: red;
}
span{
/*此处填写代码*/
display: block;
width: 200px;
height: 200px;
background: green;
}
</style>
</head>
<body>
<a href="">请把我变成块元素</a>
<span>请把我变成块元素</span>
</body>
</html>

背景图片

[外链图片转存失败(img-artH6aWw-1564155857806)(https://upload-images.jianshu.io/upload_images/11158618-05f8c12feb28e7b1.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-pwk3STVm-1564155857807)(https://upload-images.jianshu.io/upload_images/11158618-9cb8e0cacb298bd9.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-OjdV6Pfb-1564155857810)(https://upload-images.jianshu.io/upload_images/11158618-47370ba2c9a43119.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-so3XMpJa-1564155857811)(https://upload-images.jianshu.io/upload_images/11158618-3d7ac0ee55b145a9.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

[外链图片转存失败(img-LM6u4chs-1564155857815)(https://upload-images.jianshu.io/upload_images/11158618-ced7103154978f52.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]


请点赞!因为你们的赞同/鼓励是我写作的最大动力!

欢迎关注达叔小生的简书!

这是一个有质量,有态度的博客

[外链图片转存失败(img-aR2Hpt8h-1564155857816)(https://upload-images.jianshu.io/upload_images/11158618-9ab0d3fef85d80ce?imageMogr2/auto-orient/strip|imageView2/2/w/1240)]

Web前端社交账号注册按钮的更多相关文章

  1. 【Web】block、inline、inline-block元素与background属性概述(案例实现社交账号注册按钮效果)

    步骤三:社交账号注册按钮效果 文章目录 步骤三:社交账号注册按钮效果 案例的演示与分析 CSS属性与HTML标签 块级元素 内联元素 行内块级元素 CSS的display属性 CSS中的背景图片属性 ...

  2. 注册Docker官网账号 注册按钮不能点

    出现如下问题:注册按钮不能点,解决办法,如下 关于docker hub上不能注册dockeID的问题 注意的是,google访问助手,用在线安装,360安全浏览器,再重启下该浏览器,省得装插件.

  3. 转-SourceTree注册atlassian账号SIGUP按钮灰色无法注册的问题

    我们第一次安装sourcetree的时候会要求我们登陆一个账号 但是,会出现注册按钮变灰的怪现象 令人头疼的是,在官网也搞不定. 下面的网址可以顺利注册账号的网址 https://www.atlass ...

  4. Web应用多账号系统设计及微信扫码登录实现

    Web应用多账号系统设计及微信扫码登录实现 1   前言概述 公司对功能测试,性能测试,安全测试等等都做了比较好的自动化后,急需要一个MIS系统来统一管理这些结果及报表. 此MIS系统特点如下: 仅内 ...

  5. 架构设计:前后端分离之Web前端架构设计

    在前面的文章里我谈到了前后端分离的一些看法,这个看法是从宏观的角度来思考的,没有具体的落地实现,今天我将延续上篇文章的主题,从纯前端的架构设计角度谈谈前后端分离的一种具体实现方案,该方案和我原来设想有 ...

  6. Web 前端开发精华文章推荐(HTML5、CSS3、jQuery)【系列二十二】

    <Web 前端开发精华文章推荐>2014年第一期(总第二十二期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各类能够提升网站用户体验的优秀 jQuery 插件,展示前沿的 HTML ...

  7. web前端开发CSS命名规范参考

    做为一个web前端工程师,每天接触HTML.css就像吃饭一样,但是作为一名合作.优秀的web前端工程师,对DIV+CSS命名还是有一定的规范的,本文整理了一份web前端开发中DIV+CSS各种命名规 ...

  8. 定一个小目标:明年1024能成功转行web前端,光荣地成为一个程序员!

    第一次在博客园写博,我为什么要选择这里吗? 据说博客园这里的IT大牛如云,作为一个求知若渴的小白,我屁颠屁颠的跟着过来了. 于是今天早上兴高采烈的注册了账号,迫不及待的打开我的博客,呃!注册账号成功了 ...

  9. 极客Web前端开发资源大荟萃

    前端开发已经成为当前炙手可热的技术之中的一个.本周我们除了给大家带技术相关资讯,另一些技术人员经常使用的站点.希望大家不要错过我们本周的内容.原文来自:极客标签 为神马说敲代码是非常艰难的 程序猿 做 ...

随机推荐

  1. springcolud 的学习(四)服务治理. Eureka

    什么是服务治理在传统rpc远程调用中,服务与服务依赖关系,管理比较复杂,所以需要使用服务治理,管理服务与服务之间依赖关系,可以实现服务调用.负载均衡.容错等,实现服务发现与注册.服务注册与发现 在服务 ...

  2. installer

    if (args.Length == 0) { ServiceBase[] ServicesToRun; ServicesToRun = new ServiceBase[] { new MyServi ...

  3. Spring Security 解析(一) —— 授权过程

    Spring Security 解析(一) -- 授权过程   在学习Spring Cloud 时,遇到了授权服务oauth 相关内容时,总是一知半解,因此决定先把Spring Security .S ...

  4. python二维数组切片

    python中list切片的使用非常简洁.但是list不支持二维数组.仔细研究了一下发现,因为list不是像nampy数组那么规范.list非常灵活.所以没办法进行切片操作. 后来想了两个办法来解决: ...

  5. Windows10 上安装 Anaconda 后命令提示符(cmd)下无法执行(python / pip)命令解决方案

    原文:https://blog.csdn.net/qq_38644840/article/details/85064408 安装Anaconda后一段时间内能够在命令提示符(cmd)界面运行pytho ...

  6. Celery:routing

    参考:http://docs.celeryproject.org/en/latest/userguide/routing.html#guide-routing

  7. Apache Thrift安装介绍 (ubuntu)

    apache thrift是一种常用的远程服务调用框架. 下面对apache thrift的安装进行介绍: 下面是thrift的源码安装: Debian/Ubuntu (14+) 编译运行依赖安装 $ ...

  8. SolarWinds-改变端口

    Solarwinds配置文件,修改为80端口(默认为8123) C:\Program Files\SolarWinds\DPA\iwc\tomcat\conf\server.xml

  9. 【原创】STM32低功耗模式及中断唤醒(基于BMI160及RTC)的研究

    预研目标 六轴静止时,终端进入低功耗模式:六轴震动时,终端正常工作模式,从而极大减少非工作时的电流消耗. 解决方案 机器静止时,依据六轴算法,CPU进入休眠(停止)模式:机器工作时,触发六轴中断唤醒C ...

  10. 二维数组中的查找 - Java版 -简单二分查找 -<<剑指Offer>> -水题

    如题 (总结) -认真读题, 还WA了一次, https://www.nowcoder.com/practice/abc3fe2ce8e146608e868a70efebf62e?tpId=13&am ...