51CTO首页
AI.x社区
博客
学堂
精品班
软考社区
免费课
企业培训
鸿蒙开发者社区
信创认证
公众号矩阵
移动端
视频课 免费课 排行榜 短视频 直播课 软考学堂
全部课程 软考 信创认证 华为认证 厂商认证 IT技术 PMP项目管理 免费题库
在线学习
文章 资源 问答 课堂 专栏 直播
51CTO
鸿蒙开发者社区
51CTO技术栈
51CTO官微
51CTO学堂
51CTO博客
CTO训练营
鸿蒙开发者社区订阅号
51CTO软考
51CTO学堂APP
51CTO学堂企业版APP
鸿蒙开发者社区视频号
51CTO软考题库
CKA（Kubernetes 管理员认证）精品班
按照企业k8s需求进行技能培训，帮助用户快速拿下CKA认证，K8S采用新版本进行授课，课程内容全、讲解详细 。 免费试学
软考高级：系统架构设计师精品班
根据考试大纲对知识点、高频考点进行深入讲解，传授答题技巧及判断标准，助力高效备考。 免费试学
信创认证：系统架构师精品班（高级）
信息技术应用创新人才考试评价 免费试学

CSS响应式网站开发
<html> <head> //当设备屏幕最大宽度小于1024px时加载如下CSS内容 @media screen and (max-width: 1024px){ body{ width:1024px; } #main{ background-image:url(img/bg1.jpg); } }
media
响应式
html
css
加载
原创
ives404
2022-07-28 14:58:21
190阅读

如何决定响应式网站的 CSS 单位？
很高兴又见面了！在我们创建适合各种设备的响应式网站时，了解正确的CSS 单元很重要。但在深入研究决策之前，让我们对它们进行分类以便了解它们的类别。如何决定响应式网站的 CSS 单位
html
css
响应式
原力计划
屏幕尺寸
原创
海拥haiyong
2021-08-15 13:58:02
168阅读

如何决定响应式网站的 CSS 单位？
这是我参与8月更文挑战的第14天，活动详情查看：8月更文挑战 很高兴又见面了！???? 如何决定响应式网站的 CSS 单位？ 1.绝对单位 px - 像素 pt - 点 pc - Picas in - 英寸
CSS
前端
响应式设计
css
响应式
原创
海拥haiyong
2021-08-31 13:37:53
339阅读

css响应式组织架构代码 css响应式案例
什么是响应式设计？是什么？一句通俗易解得话就可以概括，所谓响应式设计就是可以让你设计的网页不仅仅在PC端显示，还可以在智能机以及iPad平板等移动设备上显示，应用了响应式设计的网页可以随着分辨率的大小进行样式变化，但是响应式设计不仅仅是关于屏幕分辨率自适应以及自动缩放的图片等等，它更像是一种对于设计的全新思维模式现在响应式设计已经应用的越来越广，学前端的我们不能不去掌握响应式设计，像美国白宫就对其
css响应式组织架构代码
响应式设计
输出设备
媒体查询
转载
笑傲江湖求败
3月前
412阅读

响应式网站设计（5）-部分css样式复习
样式1：box-shadow语法：box-shadow: h-shadow v-shadow blur spread color inset;box-shadow 向框添加一个或多个阴影。该属性是由逗号分隔的阴影列表，每个阴影由 2-4 个长度值、可选的颜色值以及可选的 inset 关键词来规定。省略长度的值是 0。
css
背景图
背景图片
颜色值
原创
CHH5431
2022-02-14 15:01:02
65阅读

css3网站响应式写法
css3响应式写法因为media不支持ie9以下的浏览器 所有要加个判断<pre> <!-- 全部通用的 --><link rel="stylesheet" href="{$yuming}/css/common.css?v={$visition}"> <!--[if lte IE 8]> <link
css3
css
ipad
自适应
绝对定位
转载
mb5fed440247fb5
2019-11-16 17:23:00
82阅读
2评论

响应式网站设计（5）-部分css样式复习
样式1：box-shadow语法：box-shadow: h-shadow v-shadow blur spread color inset;box-shadow 向框添加一个或多个阴影。该属性是由逗号分隔的阴影列表，每个阴影由 2-4 个长度值、可选的颜色值以及可选的 inset 关键词来规定。省略长度的值是 0。值 描述 h-shadow 必需。水平阴影的位置。允许...
css
背景图
背景图片
颜色值
背景颜色
原创
CHH5431
2021-08-27 12:49:59
87阅读

使用 CSS 媒体查询创建响应式网站
简介 现今每天都有更多的手机和平板电脑问市。消费者能够拥有可想象到的各种规格和形状的站、移动电话
响应式设计
查询
响应
网站
浏览器
原创
陈振阳Plus
2022-10-28 07:01:03
71阅读

基于HTML CSS 和 JavaScript 的响应式餐厅网站设计开题报告 css实现响应式布局
CSS 响应式布局也称自适应布局，是 Ethan Marcotte 在 2010 年 5 月份提出的一个概念，简单来讲就是一个网站能够兼容多个不同的终端（设备），而不是为每个终端做一个特定的版本。这个概念是为解决移动端浏览网页而诞生的。响应式布局能够为使用不同终端的用户提供很好的用户体验，而且随着大屏智能手机的普及，用“大势所趋”来形容也不为过。要实现响应式布局，常用的方式有以下几种：使用 CSS
css
javascript
html
响应式布局
缩放
转载
mob64ca1404baa2
2024-01-08 19:38:52
62阅读

【html】响应式css
1.必须引入标签： 设置 meta 标签 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 在设置视口时需要注意，视口就是网页可见区域的尺寸， ...
html
css
缩放
scala
缩放比例
转载
mob604756f99da6
2021-10-10 10:12:00
235阅读
2评论

CSS响应式设计
CSS 响应式设计（Responsive Design）是一种使网页在不同设备和屏幕尺寸上都能良好显示的方法。以下是实现响应式设计的基本技术和最佳实践。1. 媒体查询媒体查询是实现响应式设计的核心工具。它允许你根据不同的设备特性（如宽度、高度、分辨率等）应用不同的样式。基本语法@media only screen and (max-width: 600px) { body { back
响应式设计
原创 精选
抱怨是愚蠢的行为
2024-06-17 09:55:29
496阅读

CSS响应式布局
响应式布局就是在任何情况下，页面布局效果都不会发生变化，他会根据用户的电脑屏幕，尺寸大小来改变自身的布局。 浏览器窗口，VH和VW，VH 的计算方法就是，将窗口的大小分为100份，vh 的计算方法和 vh 是一样的，一个是计算高，一个是计算宽。 弹性盒子，弹性盒子是CSS3的一种新布局模式，代替浮动
左对齐
自动换行
页面布局
原创
史迪仔.
2022-06-24 00:22:40
479阅读

css - 响应式布局
方案: REM、VW、REM + VWlib-flexiblepostcss-plugin-px2rem -Dmain.js import 'lib-flexible/flexible.js'vue.config.js:css: { loaderOptions: { postcss: { plugins: [ requrie('postcss-plugin-
css
原创
mb64f93222904bd
2023-10-06 10:09:02
118阅读

CSS+DIV-公司网站
18.cssbody{  margin:0px;  padding:0px;  font-family:Arial, Helvetica, sans-serif;  font-size:12px;  background:#cad7df url(bg.jpg) repeat-x; &nbs
职场
CSS
DIV
休闲
转载
zhangjingqiang
2009-07-26 17:39:56
556阅读

响应式网站设计
关于media的各种写法：css2中和css3中 http://www.360doc.com/content/14/0704/06/10734150_391862769.shtml 使用media queries的网站锦集 http://mediaqueri.es/ 慕课网 viewport 表示可
宽高
缩放
响应式布局
慕课网
css3
转载
mob60475704a236
2016-05-31 09:04:00
167阅读
2评论

响应式网站demo
想要做一个响应式网站，要么就是找网站建设公司，要么就是自建站。对于响应式网站的设计、制作、搭建怎么样自己完成呢？最简单粗暴的方法就是通过代码编程来完成，但是那些不懂代码，又想自己建设响应式网站的个人或者企业来讲，是不是不懂代码就没有办法制作一个响应式网站了？面对这建站公司建设响应式网站的高额费用，让许多人对响应式网站失去了念头。看着响应式网站强大的功能，但是因为费用问题，只能选择放弃。那不懂代码、
响应式网站demo
响应式
建站
H5
转载
IT狼人9号
2024-10-05 11:09:22
50阅读

移动设备响应式网站之CSS媒体查询
一流的用户体验,答案是：采用响应式设计。响应式设...
css
媒体查询
CSS
样式表
原创
K的Blog
2023-01-10 11:43:43
154阅读

css响应式布局原理
移动设备优先：<metaname="viewport"content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">媒体标签：@mediascreenand(min-width:100px){div{width:100px;height:1000px;background:yellow;}}完
css
响应式
布局原理
原创
Lee_吉
2018-04-22 10:19:36
1083阅读
1点赞
2评论

css布局－响应式布局
响应式设计 .在不同设备上正常使用 .一般主要处理屏幕大小问题 .主要方法： .隐藏 ＋ 折行 ＋ 自适应空间 .rem/viewport/media query 第一个案例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">
html
iphone
自适应
手机端
响应式设计
转载
mob604757037cf3
2019-02-12 06:55:00
544阅读
2评论

CSS响应式布局实例
<style type="text/css"> body{ margin:0 aut
响应式
iphone
css
4s
原创
ives404
2022-07-28 17:33:28
167阅读
  • 1
  • 2
  • 3
  • 4
  • 5
精品课程领资料
免费资料>
2025软考
系统架构设计师 系统规划与管理师 软件设计师 系统集成项目管理工程师
信创认证
系统架构师 信创集成项目管理师 信创规划管理师 系统开发工程师
厂商认证
CKA/CKS架构师 红帽认证工程师 Oracle-OCP认证 Oracle-OCM认证
IT技术
数据库高级工程师 AIGC大模型实战 Linux云计算架构师 Python全栈开发
华为认证
数通HCIP认证 云计算HCIE认证 华为存储HCIE认证 HCIP安全认证
相关文章

css响应式media使用

【css】响应式布局结构

【译】响应式CSS动画

css 响应式flex demo

网站首页(div+css实现)

响应式网站布局学习

bootstrap响应式网站代码：

响应式网站的开发

css3媒体查询实现网站响应式布局

HTML5响应式网站 网页响应式设计

Copyright © 2005-2025 51CTO.COM 版权所有 京ICP证060544号

关于我们
官方博客 全部文章 热门标签 班级博客
了解我们 网站地图 意见反馈
友情链接
鸿蒙开发者社区 51CTO学堂
51CTO 软考资讯