开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

应不应该使用inline-block代替float

本文由99根据Steven Bradley的《Should You Use Inline-Blocks As A Substitute For Floats?》所译，整个译文带有我们自己的理解与思想

01

【JavaEE初阶】CSS

层叠样式表。(Cascading Style Sheets) CSS 能够对网页中元素位置的排版进行像素级精确控制, 实现美化页面的效果. 能够做到页面的样式和结构分离。

01

您找到你想要的搜索结果了吗？

是的

没有找到

css常用布局系统整理——实战开发后复盘小结

其包含static、relative、fixed、absolute、sticky这5个定位方式，当position后面加上这几种定位方式之后，我们就可以用top、right、left、bottom对元素进行位置改变操作啦~

04

css3 flex布局的使用图片文字垂直居中排列图文混排垂直居中 display:flex「建议收藏」

在实际工作的过程中经常遇到图片文字的混排，需要图片与一段文字垂直居中，这个实现方法以前一直非常复杂，而flex是解决这个问题比较好的办法；

02

QListWidget 布局方向设定

// 假如 m_list 添加了很多子项 (一个子项由一个图片和一段文字组成) // 如果设置为 m_second_list->setViewMode(QListView::IconMode); // 那么m_list 子项就会从左到右横向的排列图片和文字是上下排列.

04

【移动端网页布局】流式布局案例 ⑦ ( 水平排列的图片链接 2 | 浮动设置 | 盒子模型类型设置 | 结构伪类选择器 )

标签作为父盒子 , 其中容纳三个链接标签 , 每个链接标签中包含一个标签 ;

04

开心学前端（一）：HTML、CSS入门（1）1.1 html概述及html文档基本结构1.2 html标签入门

HTML是 HyperText Mark-up Language 的首字母简写，意思是超文本标记语言，超文本指的是超链接，标记指的是标签，是一种用来制作网页的语言，这种语言由一个个的标签组成，用这种语言制作的文件保存的是一个文本文件，文件的扩展名为html或者htm。

01

毛玻璃实现图片缩略图

我又双叒叕来摸鱼啦！！今天又双叒叕是做需求，发现产品给了一个缩略图排列起来的列表（虽然列表里只给了一个排列项，其他需要脑补）然鹅我发现！想象总是美好的，然而现实是非常骨感的！

01

【移动端网页布局】流式布局案例 ⑤ ( 连续排列的链接图片 | 设置盒子圆角 | 超出部分隐藏 | 设置浮动布局 | 精确计算浮动元素宽度避免换行 | 设置图片宽度自适应 )

将布局中的三个链接图片 , 放置在单独的

标签中 , 每个

标签中放置一个链接标签 , 在链接标签中包裹一个图片 ;

02

第二篇爬虫技术之HTML

hello，大家好今天我们继续分享爬虫的相关技术，今天我们分享的是html的基础知识。

01

第1章-Web网站初体验

HTML5＋CSS3＋JavaScript Web 前端开发案例教程（慕课版），微信读书中找到的学习Web前端书籍，好啦，我要带着课后习题，开始学习前端开发了，耶(＾－＾)V

03

【小程序_02】布局方式

① 安装nodejs，可选择版本(8.0)，网址：http://nodejs.cn/download/

02

HTML笔记

HTML：Hyper Text Markup Language(超级文本标签语言)

03

打造专属自己的html5拼图小游戏

利用canvas切出小块图片我们知道现在的拼图游戏都是由九张小图片依次排列组成的，就是类似九宫格那样。那么以前的做法就是我们利用Photoshop这样的工具把原始大图【尺寸一般都是正方形的哦】切成九张小块的正方形小图，但是这种做法有点不灵活，如果我们要更换图片的话，就得重新去切图，好麻烦。。。不过没关系，现在我们有了canvas！利用canvas我们可以很轻松的做到这些。核心代码如下： var image = new Image(); image.onload = function() {

06

【CSS】课程网站头部制作 ④ ( 搜索栏按钮测量 | 搜索栏按钮代码编写 | 代码示例 )

文章目录一、搜索栏按钮测量 1、按钮测量 2、按钮切图二、搜索栏按钮代码编写 1、HTML 标签结构 2、CSS 样式 3、展示效果一、搜索栏按钮测量 ---- 1、按钮测量右侧的按钮大小 , 50 x 40 像素 ; 📷 按钮颜色值 #00a4ff ; 📷 2、按钮切图使用切片工具 , 将按钮图片进行选择 , 然后进行切图 ; 📷 选择 " 菜单栏 / 文件 / 导出 / 存储为 Web 所用格式 " , 📷 选择导出的格式 , 以及 📷 切好的图片如下 : 📷 二、搜索栏按钮

07

web前端学习摘要。

HTML是具有语义化的语言，针对网页的布局，有一类标签代表各种意义的“布局盒子”。所有的布局类标签都主要用来构建页面的内容区域，是双标签类型，是双标签类型，默认显示为块状元素。

03

CSS

CSS的四种引入方式：一、行内样式

二、 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> div{ background-color: blue; color:

06

HTML基础第六课（冲浪笔记6）

1、flex-wrap: nowrap; 当内容过多，会自动缩小内容，不会自动换行（默认不换行）

03

前端语言基础【第一篇：HTML5 & CSS】

<head> </head> 指定html文档的一些属性，例如页面标题，字符集和关键字等-

02

自建随机图片API

将上述代码放入新建的PHP文件中，名称随意，我的是img.php，同级建立images目录，将图片直接放到images中即可。

03

Web 前端性能优化相关内容解析

Web 前端性能优化相关内容，来源于《Google官方网页载入速度检测工具PageSpeed Insights 使用教程》一文中PageSpeed Insights 的相关说明。大家可以对照着去优化自己的网站或者相关项目。本文由Jeff 整理。 0.提高服务器的响应速度砸钱的东西，但却最根本；搞好这一项，甚比下面任何一项。 1.优化样式表和脚本的排列顺序正确地排列外部样式表与外部和内嵌脚本的顺序，可增加下载时同时加载的数据量，并提高浏览器显示网页的速度。将样式表放在顶部，将脚本放在底部 2.使用浏览器

一定要学会的vsCode格式化整理代码的快捷键，再也不用手动调格式了

开发过程中经常遇到代码杂乱的情况，每次手动排列都需要浪费大量时间，如果能配置自动整理代码既能让代码赏心悦目也就不用再浪费排列的时间

04

【移动端网页布局】流式布局案例 ② ( 实现顶部固定定位提示栏 | 布局元素百分比设置 | 列表样式设置 | 默认样式设置 )

京东手机端 https://m.jd.com/ 顶部提示使用京东 APP 打开网页的提示 , 是通过固定定位放置在顶部的 ,

01

CIFAR-10 数据集介绍

CIFAR-10和CIFAR-100是带有标签的数据集，都出自于规模更大的一个数据集，它有八千万张小图片（http://groups.csail.mit.edu/vision/TinyImages/）。CIFAR-10和CIFAR-100的共同主页是：http://www.cs.toronto.edu/~kriz/cifar.html

00

【Canvas】266- 更优雅地基于 canvas 在前端画海报

我们的业务涉及电商、教育行业，出于营销以及功能需要，会有很多卡片展示（长按保存）的需求，或者分享长图的需求。以及我们有面向商家的 PC 端，商家端又能编辑、实时预览卡片的样式。

03

【愚公系列】2023年03月其他-Web前端基础面试题（CSS_42道）

CSS 是层叠样式表（Cascading Style Sheets）的简写，它是一种用于定义网页和网页应用程序外观的标准格式语言。

02

【CSS】课程网站头部制作 ③ ( 搜索栏表单测量 | 搜索栏表单代码编写 | 代码示例 )

导航栏文本有 10 像素内边距 , 20 像素外边距 , 文本输入框表单 , 距离导航栏外边距有 65 像素 ;

03

HTML基础03-HTML标签（下）02-列表标签

表格是用来显示数据的，而列表是用来布局的。列表最大的特点就是整齐、整洁、有序，用它做布局会更加自由和方便。根据使用场景的不同，列表可以分为无序列表、有序列表和自定义列表三大类。

01

07.HTML实例

07.HTML实例 HTML 实例 HTML 基础非常简单的HTML文档 HTML 标题 HTML 段落 HTML 链接 HTML 图片 HTML 标题 HTML 标题在html源码中插入注释

04

第11章手机响应式开发（下）

HTML5＋CSS3＋JavaScript Web 前端开发案例教程（慕课版）【不推荐】，微信读书中找到的学习Web前端书籍，第11章开始啦，完结了！耶(＾－＾)V

02

wordpress子比主题更改首页样式全宽度[美化教程]

在主题目录下“func.php”下面添加下面代码，这是我修改后的“图文封面卡片”小工具

02

微搭低代码从入门到精通07-基础布局组件

低码开发不同于传统开发，传统开发我们通常需要编写前端代码和后端代码。前端代码由HTML、CSS和JavaScript组成，后端代码我们通常要用后端语言比如Java来编写接口。

02

【CSS】课程网站头部制作 ② ( 导航栏测量 | 导航栏编写 | 代码示例 )

导航栏最左侧位置 , 距离 logo 盒子有 70 像素 , 考虑到设置外边距 , 这里将 logo 盒子与导航栏之间的距离设置成 60 像素即可 ;

02

CSS float浮动的深入研究、详解及拓展一一一一一一一一

我们使用float浮动做了很多其本职工作以外的事情，于是我们会混淆，我们会回看不清float真正的面目。浮动真正的意义在哪里呢？要知道这个问题的答案很简单，假设现在CSS中没有浮动(float)属性，那么会变成一个什么样子。我们会发现，目前流行采用浮动方法实现的无论是分栏布局，还是列表排列我们都可以用其他一些CSS属性（不考虑table）代替实现，唯一一个实现不了的就是“文字环绕图片”，我是想不出来能有什么方法可以让文字环绕图片显示。好，这个替代不了的作用才是float真正的意义所在。此作用类似于word中的版式，很基础的原始的作用：

01

七个帮助你处理Web页面层布局的jQuery插件

1.UI.Layout jQuery UI布局插件官方网站：http://layout.jquery-dev.com/index.cfm 使用大小可折叠的嵌套面板和大量选项创建高级UI布局。布局

02

SecureCRT ，专业的ssh终端工具

SecureCRT 是一款专业的ssh终端工具，可以在Mac，Linux和Windows之间轻松切换。通过使用内含的VCP命令行程序可以进行加密文件的传输。

02

浅析inline-block--使用inline-block创建布局

inline-block前端程序猿们肯定不陌生，它是display属性的一个取值。　　之所以称之为inline-block。是因为它兼具行内元素(inline-element)和块级元素(block-element)的特征。块级元素（block elements）,来源于CSS盒子模型。块级元素包含width height,padding,border与margin，他们的排列方式是从上到下排列。行内元素，排列方式是水平排列。行内元素（inline elements）排列方式是水平排列。行内块

07

一些常用的标签丨直接代码「建议收藏」

<!doctype html> <html> <head> <meta charset=”utf-8″ /> <meta name=”description” content=”网页描述” /> <title>小海绵就是我呀丨by：xiaohaimian</title> </head> <body>

行内元素：行内元素会在一条直线上排列，都是同一行的，水平方向排列丨行内元素不能包含块级元素丨

<b>粗体 <srtong><srong>表示粗体，具有语义化</srtong> 斜体 <em>斜体，具有语义化 <u>下划线 ~~<s>删除线~~ ^<sup>上标 _<sub>下标 <a>超链接 ”<img>图片链接”

”<img>图片链接”

<span>本身没有任何属性

块元素：块级元素各占据一行，垂直方向排列。块级元素从新行开始结束接着一个断行丨块级元素可以包含行内元素和块级元素丨行内元素与块级元素属性的不同，主要是盒模型属性上

<p>段落

<h1>h1~h6标题，h1~h6从大到小

03

初识爬虫必须要了解的基本原理

在写爬虫之前，我们还需要了解一些基础知识，如 HTTP 原理、网页的基础知识、爬虫的基本原理、 Cookies 的基本原理等。

01

那些经常使用的 CSS3属性

实用的css3属性 1、display:flex||inline-flex display flex inline-flex 解释将对象作为弹性伸缩盒显示将对象作为内联块级弹性伸缩盒显示项目中的应用我当时写过一个因为子元素浮动让div自适应高度的解决办法，使用的是css方法解决的。div高度自适应下面就是换用display:flex解决 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <titl

02

移动web开发(3)之flex弹性布局

过去我们要在一个大盒子里面放三个这样的盒子,都是用的浮动,但是学习了弹性flex布局,我们可以更简单的做出来,为了凸显它的优势,用的还是行内元素span,只要用了flex,行内元素也可以直接设置大小.

01

HTML5快速设计网页[通俗易懂]

1、认识网页：商城网页比较经典，比如京东，淘宝、小米商城还有锤子官网等有图片、文字还有一些多媒体组合而成的。我们还需要善于观察然后模仿成自己的

02

浮动(float)

html语言当中另外一个相当重要的概念----------标准流！或者普通流。普通流实际上就是一个网页内标签元素正常从上到下，从左到右排列顺序的意思，比如块级元素会独占一行，行内元素会按顺序依次前后排列；按照这种大前提的布局排列之下绝对不会出现例外的情况叫做普通流布局。

01

Android开发笔记（一百四十一）读取PPT和PDF文件

上一篇博文讲到在Android上如何读取word文件内容，那么office三剑客中还剩ppt文件的读取。前面解析word文件和excel文件时，都用到了poi库读取文件内容，对于ppt一样也可以通过poi读取幻灯片中的文本。HSLFSlideShow类就是poi中专门用于解析幻灯片的工具类，每张幻灯片又分别由单独的HSLFSlide类处理，幻灯片中的具体图文内容则由HSLFTextParagraph和HSLFTextRun进行分辨。下面是使用poi解析ppt文件（2003格式）的效果图：

03

【CSS】浮动 ⑤ ( 浮动布局案例 - 导航栏模块 | 核心要点说明 | 网页默认样式 | 盒子模型居中显示 | 设置渐变背景 | 设置列表浮动 | 设置文本水平垂直居中 | 设置链接文本样式 )

盒子模型居中显示 : 此处涉及到了顶部的 Banner 图片 , 和下方的导航栏需要居中显示 , 设置 margin: auto; 和 margin: 0 auto; 都可以实现该效果 ;

02

【CSS】课程网站 Banner 制作 ① ( Banner 栏测量 | Banner 盒子模型代码 | 代码示例 )

该 Banner 条宽度填充整个浏览器 , 不需要给出宽度 , 只需要设置高度即可 ;

02

前端之HTML和CSS

HTML是 HyperText Mark-up Language 的首字母简写，意思是超文本标记语言，超文本指的是超链接，标记指的是标签，是一种用来制作网页的语言，这种语言由一个个的标签组成，用这种语言制作的文件保存的是一个文本文件，文件的扩展名为html或者htm。

03

仿百度排列图片预览插件-Simple Lightbox

很久以前遇到过这样的一个面试题，要求手写代码，实现百度图片的排列预览，并且可以左右点击查看下一张照片，当时没有做出来，这个问题也就一直放在了脑后，工作之后，遇到这样的需求之后，第一反应想到的是在源码网站里面找一个插件，方便省事，不在像从前那般手敲代码，一敲就是一整天的感觉。

02

【改革春风吹满地 HDU - 2036 】【计算几何-----利用叉积计算多边形的面积】

我们都知道计算三角形的面积时可以用两个邻边对应向量积（叉积）的绝对值的一半表示，那么同样，对于多边形，我们可以以多边形上的一个点为源点，作过该点并且过多边形其他点中的某一个的多条射线，这样就可以把该多边形变为多个三角形，然后利用叉积求面积即可。不过要注意，对于三角形可以简单的用叉积的绝对值的一半表示，但对于多边形不可随意将它分割成的几个三角形对应的叉积的绝对值相加，要有一定顺序才可。对于三角形，有

02

四种方式实现瀑布流

css3的column属性实现外层容器设置column-count(改变列数)和column-gap(改变间隙)，即可实现瀑布流布局 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>css瀑布流</title> <style>

02

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭