Python 使用Google编辑css样式

使用google浏览器写css

1.使用pychram,创建一个html界面,使用Google运行,打开设置-更多工具-开发者工具
1729999-20190912174616417-961132676.png

2.选中Elements,可看到html代码
1729999-20190912174629285-327018539.png

3.编辑body,选中body,出现三个点(设置),点击Edit as HTML,可写标签,例如div
1729999-20190912174644160-741015209.png
1729999-20190912174656209-365946268.png
1729999-20190912174714768-1275368296.png

4.新增一个div标签
1729999-20190912174727226-676234380.png

5.双击可以进行编辑
1729999-20190912174737190-1887324122.png

6.选择小尖头,选择渲染后的界面区域,可过滤到这个div的代码
1729999-20190912174747919-1699172662.png

1729999-20190912174808092-2023098798.png

7.给div标签添加类选择器,class='class1'
1729999-20190912174826134-1387310419.png

8.在head标签中添加一个style(css样式)标签,实例选择类选择器进行样式添加
1729999-20190912174840226-1333648230.png

9.选中这个.class1选择器,下方出现div.class1,如果没有.class1,点击.cls,进行类的添加名称与选择器的名字一致,勾选后即可对这个选择器进行样式编辑啦
1729999-20190912174849023-1475595268.png

10.样式可在这个区域进行修改
1729999-20190912174900588-404106503.png

11.在此就可以对样式进行编辑,可以愉快的在浏览器编辑啦,将属性写到代码中就可以啦
1729999-20190912174909719-1242590189.png

12.将调式的属性放到代码中即可
1729999-20190912174929325-2046367016.png

13.最后再运行你的html文件,style样式变更新啦
1729999-20190912174938242-565024606.png

转载于:https://www.cnblogs.com/zhangshan33/p/11514296.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值