四、Chrome调试工具

四、Chrome调试工具

1.1 Chrome调试工具操作

  1. 打开方式
  • 右击→ 检查
  • 看哪里
  1. 选择元素
  • 两种常见方法
  1. 控制样式
  • 修改属性值
  • 添加属性
  • 控制样式生效
  1. 特殊情况
  • 出现删除线
  • 出现小三角形

1.2 Chrome调试工具总结

(拓展)查错流程(遇到样式出不来,要学会通过调试工具找错)

1. PxCook的基本使用

  1. 1.通过软件打开设计图
  • 打开软件
  • 拖拽入设计图
  • 新建项目
  1. 2.常用快捷键
  • 放大设计图: ctrl ++
  • 缩小设计图: ctrl ±
  • 移动设计图:空格按住不放,鼠标拖动
    1. 常用工具
  • 量尺寸
  • 吸颜色
  1. 从psd文件中直接获取数据
  • 切换到开发界面,直接点击获取数据
相关推荐
爱上好庆祝4 小时前
svg图片
前端·css·学习·html·css3
whuhewei9 小时前
JS获取CSS动画的旋转角度
前端·javascript·css
冰暮流星16 小时前
javascript之dom访问css
开发语言·javascript·css
榴莲omega17 小时前
第13天:CSS(二)| Grid 布局完全指南
前端·css·js八股
牧杉-惊蛰17 小时前
修改表格选中时的背景色与鼠标滑过时的背景色
前端·javascript·css·vue.js·elementui·html
xiaokuangren_1 天前
前端css颜色
前端·css
hhcccchh1 天前
1.2 CSS 基础选择器、盒模型、flex 布局、grid 布局
前端·css·css3
军军君011 天前
Three.js基础功能学习十六:智能黑板实现实例三
前端·javascript·css·vue.js·3d·前端框架·threejs
海上彼尚1 天前
SVG矢量图形快速入门
前端·html5
军军君011 天前
Three.js基础功能学习十四:智能黑板实现实例一
前端·javascript·css·typescript·前端框架·threejs·智能黑板