开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

Jump Start Bootstrap 第2章

在这一章，我们将讨论Bootstrap一个最重要的功能：网格系统。我们将学会网格系统如何工作；我们如何在应用中使用网格系统；我们也将创建简单的网页布局去更好的理解它。

04

CSS侧边栏宽度不动(更改页面宽度时)，内容区宽度自适应

一个页面，左栏是内容栏content，右栏是侧边栏sidebar。如何使侧边栏宽度不动(更改页面宽度时)，内容区宽度自适应呢？为了保证内容区宽度自适应，先不设定其宽度，使其填充整个DIV区域，设定足够大小的右外边距，左浮动。侧边栏使用负margin，设置一定的负值左外边距，使其浮动到实现设定好的空白右外边距的地方。 <style> div#wrapper { margin:15px 0; overflow:auto; } div#content { float:left; margin-right:465p

05

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

是的

没有找到

这30个CSS选择器，你必须熟记（上）

CSS的魅力就是让我们前端工程师像设计师一样进行网页的设计，我们能轻而易举的改变颜色、布局、制作出漂亮的影音效果等等，我们只需要改几行代码，不需要借助任何软件，就能轻而易举的实现，感觉就像魔法师一般，几秒钟就能得到一个想要的效果，是不是很酷呢。

02

这30个CSS选择器，你必须熟记（上）

css的魅力就是让我们前端工程师像设计师一样进行网页的设计，我们能轻而易举的改变颜色、布局、制作出漂亮的影音效果等等，我们只需要改几行代码，不需要借助任何软件，就能轻而易举的实现，感觉就像魔法师一般，几秒钟就能得到一个想要的效果，是不是很酷呢。

01

Python3 hashlib密码散列算法原理详解

hashlib模块定义了一个API来访问不同的密码散列算法。要使用一个特定的散列算法，可以用适当的构造器函数或new()来创建一个散列对象。不论使用哪个具体的算法，这些对象都使用相同的API。

01

bootstrap 网格布局

<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">

01

终端输出 Table？不要再用 console.table 了！这个 Node.js 库值得尝试下~

使用 Table 将一组数据打印在终端，你最先想到的是什么？console.table()？

01

「css基础」Transforms 属性在实际项目中如何应用？

关于Transform变形属性大家都不陌生吧，可以通过此属性实现元素的位移translate(x,y)，缩放scale(x,y)，2d旋转rotate(angle)，3d旋转rotate3d(angle),倾斜变换skew(x-angle,y-angle)等，你也许已经很熟悉了这些属性，或许你也会有这样的困惑，这些属性在实际项目中如何应用呢？

03

「css基础」Transforms 属性在实际项目中如何应用？

关于Transform变形属性大家都不陌生吧，可以通过此属性实现元素的位移translate(x,y)，缩放scale(x,y)，2d旋转rotate(angle)，3d旋转rotate3d(angle),倾斜变换skew(x-angle,y-angle)等，你也许已经很熟悉了这些属性，或许你也会有这样的困惑，这些属性在实际项目中如何应用呢？

00

Vim 文本对象指南 (1)

本文还是介绍一些基本内容, 关于插件使用, 可以查看完整配置 space-vim.

02

bootstrap affix 左侧栏导航栏

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Bootstrap 附加导航（Affix）插件</title> <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script> <style> /* Custom Styles / ul.nav-tabs{ width: 140px; margin-top: 20px; border-radius: 4px; border: 1px solid #ddd; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.067); } ul.nav-tabs li{ margin: 0; border-top: 1px solid #ddd; } ul.nav-tabs li:first-child{ border-top: none; } ul.nav-tabs li a{ margin: 0; padding: 8px 16px; border-radius: 0; } ul.nav-tabs li.active a, ul.nav-tabs li.active a:hover{ color: #fff; background: #0088cc; border: 1px solid #0088cc; } ul.nav-tabs li:first-child a{ border-radius: 4px 4px 0 0; } ul.nav-tabs li:last-child a{ border-radius: 0 0 4px 4px; } ul.nav-tabs.affix{ top: 30px; / Set the top position of pinned element */ } </style> <script> ("#myNav").affix({ offset: { top: 125 } }); }); </script> </head> <body data-spy="scroll" data-target="#myScrollspy">

Bootstrap Affix

第一部分
第二部分
第三部分
第四部分
第五部分

第一部分

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eu sem tempor, varius quam at, luctus dui. Mauris magna metus, dapibus nec turpis vel, semper malesuada ante. Vestibulum id metus ac nisl bibendum scelerisque non non purus. Suspendisse varius nibh non aliquet sagittis. In tincidunt orci sit amet elementum vestibulum. Vivamus fermentum in

02

编辑-发布-开发分离：git作为NoSQL数据库

动态网页是下一个要解决的难题。我们从数据库中读取数据，再用动态去渲染出一个静态页面，并且缓存服务器来缓存这个页面。既然我们都可以用Varnish、Squid这样的软件来缓存页面——表明它们可以是静态的

Rmarkdown与Word文档的交互

在Rmarkdown中提供了直接生成Word文档格式的选项，只要在新建rmarkdown时选择Word选项就行了。

05

bootstrap 网格实例1

class,container,row,col-md-6 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Bootstrap 实例 - 堆叠的水平</title> <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <script src="https://cdn.staticfile.org/jquery/2.0.0/jquery.min.js"></script> <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body>

01

bootstrap 网格布局 3

<!DOCTYPE html> <html> <head> <title>Bootstrap 实例 - 手机、平板电脑、台式电脑</title> <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <script src="https://cdn.staticfile.org/jquery/2.0.0/jquery.min.js"></script> <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body>

04

如何在React项目中，创建令人惊叹的动画翻转卡片效果

为了实现翻转卡片，我们将使用React-Card-Flip库。在本教程中，我们将逐步介绍创建动态卡片组件并在交互时翻转的过程。

02

CSS 的浮动(float)布局是什么？

用 float 属性，可以实现元素（文字、图片等）的浮动显示功能，通过下面几个实例来展示浮动布局的效果以及浮动布局带来的一些问题？

03

bootstrap 网格布局 2

<!DOCTYPE html> <html> <head> <title>Bootstrap 实例 - 中型和大型设备</title> <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <script src="https://cdn.staticfile.org/jquery/2.0.0/jquery.min.js"></script> <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body>

02

关于Lorem ipsum

Wikipedia上的解释是，这只是一段用来测试排版效果的占位文字，没有实际的含义。据说，16世纪的时候就有人开始用了。当时的某个印刷工人，从古罗马政治家西塞罗的文章中，选了一段拉丁文，"Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit "，进行了混排，就把它创造出来了。这句拉丁文的英译是"Neither is there anyone who loves grief itself since it is grief and thus wants to obtain it"，译成中文就是"无人爱苦，亦无人寻之欲之，乃因其苦......"（不知是谁的手笔，译得真漂亮啊。）

01

Bootstrap响应式前端框架笔记十八——导航滚动监听

Bootstrap框架中提供了十分方便的方法来使用导航关联内容快，并且开发者可以监听滚动进行导航按钮的切换，示例如下：

01

3分钟理解响应式布局

总听别人说响应式布局，觉得是一个很高大上的东西，近日做的一个项目需要适配不同的屏幕尺寸，于是就简单研究了一下 Web响应式布局，其实原理很简单，下面就简单整理了一下分享给大家。

02

快点收藏吧：19 个 JavaScript 有用的简写技术

1.三元操作符当想写if...else语句时，使用三元操作符来代替。 const x = 20;let answer;if (x > 10) { answer = 'is greater'

03

总是听别人说响应式布局，原来这么简单

作者：麻酱原文：http://www.majiang.life/blog/head-first-responsive-web-design/ 前言总听别人说响应式布局，觉得是一个很高大上的东西，

05

R语言之可视化（32）之ggtext：提高ggplot2的文本呈现

该ggtext软件包为ggplot2 提供了富文本（基本HTML和Markdown）支持。富文本可用于图注解（图标题，字幕，标题，轴标签，图例等）中并可视化文本数据，就像通常使用geom_text（）。

04

Markdown简介【Programming】

长期以来，我都认为我在GitLab和GitHub上看到的所有带有.md扩展名的文件都是专门为开发人员编写的文件类型。直到几周前当我开始使用Markdown时，情况发生了变化。它很快成为我日常工作中最重要的工具。

00

R：ggtext包丰富ggplot2中文本的表现力

ggtext让ggplot2图像也可以使用html、markdown及css语法，丰富了ggplot2文本的表现力。

02

15个JavaScript 编码小技巧

三元操作符如果使用if...else语句，那么这是一个很好节省代码的方式。 Longhand: const x = 20;let answer;if (x > 10) { answ

01

19个JS超有用的简写技巧

1.三元操作符当想写if...else语句时，使用三元操作符来代替。 const x = 20; let answer; if (x > 10) { answer = 'is greate

05

bootstrap 左边栏菜单常用样式

<style> /* Custom Styles / ul.nav-tabs{ width: 140px; margin-top: 20px; border-radius: 4px; border: 1px solid #ddd; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.067); } ul.nav-tabs li{ margin: 0; border-top: 1px solid #ddd; } ul.nav-tabs li:first-child{ border-top: none; } ul.nav-tabs li a{ margin: 0; padding: 8px 16px; border-radius: 0; } ul.nav-tabs li.active a, ul.nav-tabs li.active a:hover{ color: #fff; background: #0088cc; border: 1px solid #0088cc; } ul.nav-tabs li:first-child a{ border-radius: 4px 4px 0 0; } ul.nav-tabs li:last-child a{ border-radius: 0 0 4px 4px; } ul.nav-tabs.affix{ top: 30px; / Set the top position of pinned element */ } </style> </head> <body data-spy="scroll" data-target="#myScrollspy">

Bootstrap Affix

第一部分
第二部分
第三部分
第四部分
第五部分

第一部分

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eu sem tempor

04

19 个常用的 JavaScript 简写方法

1.三元操作符当想写 if...else 语句时，使用三元操作符来代替。 const x = 20; let answer; if (x > 10) { answer = 'is great

大一新生HTML期末作业个人旅游图片博客HTML5 用DIV+CSS技术设计的个人网站（web前端网页制作课作业）

✍️ 作者简介: 一个热爱把逻辑思维转变为代码的技术博主 🥇 关于作者: 历任研发工程师，技术组长，教学总监；曾于2016年、2020年两度荣获CSDN年度十大博客之星。十载寒冰，难凉热血；多年过去，历经变迁，物是人非。然而，对于技术的探索和追求从未停歇。 💪坚持原创，热衷分享，初心未改，继往开来！一、👨‍🎓网站题目 🧑个人网页设计、🙋‍♂️个人简历制作、👨‍💼简单静态HTML个人网页作品、👨‍🏭个人介绍网站模板、等网站的设计与制作。

二、✍️网站描述 ⭐个人网页设计网站模板采用DI

02

如何提升你的javascript代码逼格之简写篇

当你想用一行代码来写if...else语句的时候，使用三元操作符是非常好的选择，例如：

04

CSS 布局_3 Position元素定位

我们之前已经介绍过行元素，块元素及行内块元素的属性了，能够知道它们是具有自己默认的显示方式的，即元素会按照文档流 (document flow) 的方式，自上而下，从左到右进行布局，如果你想要改变元素默认的定位行为，就需要设置 position 属性了

04

一样的代码、不一样的写法，JavaScript必知的简写技巧|附源代码

初级篇 1、三目运算符下面是一个很好的例子，将一个完整的 if 语句，简写为一行代码。 const x = 20; let answer; if (x > 10) { answer = 'great

HTML代码片段

IE条件注释除了IE <![endif]--> 用Chrome或

02

JavaScript 开发人员需要知道的简写技巧

本文来源于多年的 JavaScript 编码技术经验，适合所有正在使用 JavaScript 编程的开发人员阅读。本文的目的在于帮助大家更加熟练的运用 JavaScript 语言来进行开发工作。文章将分成初级篇和高级篇两部分，分别进行介绍。初级篇 1、三目运算符下面是一个很好的例子，将一个完整的 if 语句，简写为一行代码。 const x = 20; let answer; if (x > 10) { answer = 'greater than 10'; } else { ans

03

19+ JavaScript 常用的简写技巧

06

Python 中的字符串基础与应用

在Python中，字符串可以用单引号或双引号括起来。'hello' 与 "hello" 是相同的。您可以使用print()函数显示字符串文字：

02

今天 Java 14 正式发布了！放弃 Java 8 行吗？

Java 14今天正式发布了。那么，14版究竟有什么新功能，对于整天写代码、维护代码的Java开发者来说，哪些功能最有用呢？

03

【CSS】1049- 深入了解::before 和 ::after 伪元素

本文从最简单的开始，解释如何理解和使用::before和::after。然后再在实际使用场景中去应用它。

02

linux 批处理教程,最全的批处理入门教程，菜鸟必看[通俗易懂]

1.这是一篇技术教程，我会用很简单的文字表达清楚自己的意思，你要你识字就能看懂，就能学到知识。写这篇教程的目的，是让每一个看过这些文字的朋友记住一句话：如果爱可以让事情变的更简单，那么就让它简单吧！看这篇教程的方法，就是慢！慢慢的，如同品一个女人、一杯茗茶，你会发现很多以前就在眼前的东西突然变的很遥远，而有些很遥远的东西却又突然回到了眼前。

02

JavaScript 开发人员需要知道的简写技巧

本文来源于多年的 JavaScript 编码技术经验，适合所有正在使用 JavaScript 编程的开发人员阅读。

01

Python简易爬虫小实例：爬取NBA球队13-14赛季对阵数据

这部分内容来自参考书《Python网络数据采集》第一章的内容基本流程：通过urlopen()函数获得网页的的全部HTML代码；然后通过BeautifulSoup模块解析HTML代码获得我们想要的内容

02

Web-CSS

定义在css样式文件中，通过选择器影响对应的标签。可以用link标签引入某些页面。

02

Python入门系列（三）基础数据类型

您可以使用int（）、float（）和complex（）方法从一种类型转换为另一种类型

03

简单说 CSS中的 object-fit 与 object-position

版权声明：本文为博主原创文章，欢迎转载，转载请注明出处。 https://blog.csdn.net/FE_dev/article/details/78249063

04

2021年要了解的34中javascript优化技术

您可能已经进行了很久的Javascipt开发，但有时你可能没有编写一些额外最近的代码去解决你的问题。这些技术可以帮助你编写干净并且优化你的Javascript代码。此外，这些主题可以帮助你为2021年的Javascipt面试做好准备。

02

来了来了,Java14它真的来了

语言必须发展，否则它们就有变得无关紧要的风险，” Brian Goetz (甲骨文公司)在2019年11月在 Devoxx 举行的“ Java 语言期货”演讲中说。作为 Java 语言架构师，他扮演了一个重要的角色，尽管 Java 已经发展了25年，但仍然远远没有过时。在本文中，我们将研究 JDK 14的创新

00

PHP中非常有用却鲜有人知的函数集锦

PHP里有非常丰富的内置函数，很多我们都用过，但仍有很多的函数我们大部分人都不熟悉，可它们却十分的有用。这篇文章里，我列举了一些鲜为人知但会让你眼睛一亮的PHP函数。

03

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭