利用扩展双屏技术及Chrome浏览器,快速剖析优秀网页Div及CSS构成,并高效实现原型创作
学习目标:
作为一个Web前台设计人员,应该充分利用可利用的硬件条件及专业的软件工具,迅速进入到高效氛围当中.实践中,我们可以利用扩展桌面双屏技术及Chrome浏览器快速剖析优秀网页Div及CSS构成,并快速实现原型创作,不妨为一个好的实践手段。
制作步骤
一.台式机安装一个双头显卡,可以实现主机箱上外接两个显示器,(提示:如果是笔记本电脑,可以直接外接一个显示器,不用再额外安装显卡),然后,设置扩展桌面,设置方法请点击此处,有详细讲解,最终效果如下图所示,主显示器上有桌面图标,第二显示上没有任何东西。
二.然后启动google浏览器Chrome,然后把浏览器拖到左面的第二显示器上,并访问一些优秀的打算学习的网页:比如:http://women.sohu.com,如下图所示:
三.如下图所示,右击你感兴趣的网页局部,在弹出的菜单中,点击【审查元素】命令.
四.下方打开一个元素审查页面,然后,点击左下角命令:Undock into separate window,如下图:
五.左面的主显示显示 审查元素的界面,右面的副显示器显示浏览的页面,通过点击右面浏览器页面局部元素或点击点击左面审查元素,定位到你关注的局部代码
六.同时,可以下载相关的资源文件,比如:CSS背景图片,如图所示:
下载后的CSS背景图片文件,如下图:
七:找到相关的CSS选择器内容并复制:
八.复制的相关图片及CSS内容至Dreamweaver网站中,重新进行原型创造,如下图所示:
最终页面原型创作效果:
利用扩展双屏技术及Chrome浏览器,快速剖析优秀网页Div及CSS构成,并高效实现原型创作相关推荐
- Chrome浏览器快速切换DOH DNS
Chrome 浏览器 快速切换DNS 在书签栏创建一个书签,命名dns 手动复制下面连接 chrome://settings/security?t=https://doh.pub/dns-query& ...
- 在Chrome浏览器中如何将网页保存为单个文件mhtml?
在Chrome浏览器中如何将网页保存为单个文件mhtml? 问题: 在Chrome浏览器中如何将网页保存为单个文件mhtml? 答案: 下载一个 Save Page WE 扩展程序: 将其添加到浏览器 ...
- 利用pandas库中的read_html方法快速抓取网页中常见的表格型数据
利用pandas库中的read_html方法快速抓取网页中常见的表格型数据 本文转载自:https://www.makcyun.top/web_scraping_withpython2.html 需要 ...
- Exception】Chrome浏览器提示:此网页正试图从未经验证的来源加载脚本
[Exception]Chrome浏览器提示:此网页正试图从未经验证的来源加载脚本 一.问题描述 1.公司网站配置了https证书后,使用Chrome浏览器访问某个页面,出现JS没有执行情况,浏览器右 ...
- notepad++ 编写html代码快捷键切换到浏览器查看,notepad++在chrome浏览器中打开查看网页效果...
notepad++在chrome浏览器中打开查看网页效果,操作设置:运行--在chrome浏览器中打开,这是notepad默认的设置方式 但是notepad++如果没有配置chrome浏览器打开,可以 ...
- chrome浏览器插件开发-在当前网页中嵌入插件页面
chrome浏览器插件开发-在当前网页中嵌入插件页面 既然想嵌入插件页面就是需要写html和css 在myPlugin中创建contentCss文件夹,里面创建index.css文件 在manifes ...
- 利用配置组策略解决Chrome浏览器第三方扩展被停用的问题
首先根据以下代码生成文件chrome.adm CLASS MACHINECATEGORY !!googleCATEGORY !!googlechromeKEYNAME "Software\P ...
- Chrome浏览器快速获取静态控件的XPATH
一些静态控件.可根据浏览器快速获取xpath 步骤: 1.F12 2.定位到待定位控件 3.右键html元素,菜单选择copy 4.下拉框选择 copy xpath 5.粘贴 即可获取xpath字符串 ...
- 【截取整个网页】Chrome浏览器快速截屏,高清截图
Chrome版本78,window 10系统 第一步:打开 Chrome 浏览器,输入网址,例如输入网址:https://www.golianghao.com. 第二步:Ctrl + shift + ...
- 解决Chrome浏览器打开虾米音乐网页播放器时的排版问题
2019独角兽企业重金招聘Python工程师标准>>> 几年了,虾米音乐网页播放器听音乐都有个纠结的地方,就是用Chrome浏览器打开时,排版会出错,表现为播放器右边一部分显示不出来 ...
最新文章
- CVPR2020文章汇总 | 点云处理、三维重建、姿态估计、SLAM、3D数据集等(12篇)
- raster java_Raster
- SQl常用语句总结(持续更新……)
- Codeforces Round #716 (Div. 2) D. Cut and Stick 主席树 + 思维
- 制作一键架设服务器,【教程】大话西游一键端制作装备物品教程(一键端搭建续)...
- Linux内核源代码分析——swap实现
- bzoj1226: [SDOI2009]学校食堂Dining
- 了解人工智能与智能系统中的先驱人物
- 51nod1649齐头并进-Dijkstra
- wkhtmltox html快速转成image或pdf
- 数据库sql 四种语言DDL DML DCL DQL 基本语法
- 等价类划分测试用例设计方法
- 百战程序员数据结构 课件_结构之战
- RocketMQ5.0.0事务消息
- Mybatis 详细的创建流程及创建第一个Mybatis增删改查程序 CRUD
- CRUSH算法 - 可控、可伸缩、分布式地归置多副本数据
- java日期格式中MMM的问题
- 安卓via浏览器settings.xml修改浏览器标识UserAgent
- 如何将flash源文件在flash MX里整体缩放或移动!
- 医用耗材管理系统的模式的应用实践-盘谷