[外链图片转存失败(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. WPF 使用 AppBar 将窗口停靠在桌面上,让其他程序不占用此窗口的空间(附我封装的附加属性)

    原文:WPF 使用 AppBar 将窗口停靠在桌面上,让其他程序不占用此窗口的空间(附我封装的附加属性) 本文介绍如何使用 Windows 的 AppBar 相关 API 实现固定停靠在桌面上的特殊窗 ...

  2. 手把手教你打造高效的 Kubernetes 命令行终端

    Kubernetes 作为云原生时代的操作系统,熟悉和使用它是每名用户的必备技能.本文将介绍一些提高操作 Kubernetes 效率的技巧以及如何打造一个高效的 Kubernetes 命令行终端的方法 ...

  3. springboot笔记10——整合Redis

    依赖 <dependencies> <!--web依赖--> <dependency> <groupId>org.springframework.boo ...

  4. SpringDataRedis

    一.简介 1.SpringData和Redis Redis将数据存储到内存的,速度快.可以解决请求mysql数据库过多而导致mysql崩溃的问题. SpringData是专门用来控制Redis的工具, ...

  5. How do you run an interactive process in Dart?

    https://stackoverflow.com/questions/12682269/how-do-you-run-an-interactive-process-in-dart The test ...

  6. java自定义注释及其信息提取

    转自:https://xuwenjin666.iteye.com/blog/1637247 1. 自定义注解 import java.lang.annotation.Retention; import ...

  7. Oracle间隔(interval)分区

    (一)什么是间隔分区 间隔分区是Oracle 11.1引入的新功能,通过该功能,可以在输入相应分区的数据时自动创建相应的分区.在没有间隔分区技术之前,DBA通常会创建一个maxvalue分区以避免OR ...

  8. golang之网络开发

    TCP Server/Client开发 net包提供network I/O开发接口,包括TCP/IP.UDP.DNS和Unix domain sockets. 常用开发一般仅需要最基础接口或函数: 服 ...

  9. 树莓派配置samba服务器,实现linux、windows文件共享

    一.安装samba服务器 输入如下命令: 二.配置文件smb.conf 找到[homes],将read only那里的yes改为no,允许读写 添加用户和设置密码 sudo smbpasswd -a ...

  10. 实验之RSTP基础配置

    STP升级版之RSTP 实验环境 实验拓扑图 实验编址 实验步骤 1.基本配置配置PC端 测试i相通性 2.配置RSTP基本功能在S1-S4上都使用命令stp mode rstp更改生成树模式(因为华 ...