html img 能显示psd吗_psd变成html

html img 能显示psd吗_psd变成html今日小结psd是指经过Photoshop处理过保存后的图片,其格式为psd。这是清除浮动的最常用,最普遍的方法拿到图片将psd变成html代码的步骤如下:1.样式文件和初始化①可以新建三个文件夹。(css,images,js)然后在css下需要建立三个样式,”index,common(公共),reset(重置)”新手比如我,需要这样写,但是熟练以后就不用了js下需要建立(index)这一个样式。(…

大家好,又见面了,我是你们的朋友全栈君。

今日小结

psd是指经过Photoshop处理过保存后的图片,其格式为psd。

9c483fda5e01

这是清除浮动的最常用,最普遍的方法

拿到图片将psd变成html代码的步骤如下:

1.样式文件和初始化

①可以新建三个文件夹。(css,images,js)

然后在css下需要建立三个样式,”index,common(公共),reset(重置)”新手比如我,需要这样写,但是熟练以后就不用了

js下需要建立(index)这一个样式。(即html)

9c483fda5e01

在js下需要将css中的所有文件样式用link引入

reset也是公共样式,以后熟练以后可以将reset和common合并在一起

②为了使得js中的index.html写完代码后,div块,和上面挨着,不留空隙。即不让原来默认样式有作用,需要重写reset默认样式。

将常用的块级元素,行内元素,都重置。用语句{margin:0;padding:0;}

注:一般不用通配符”*”,因为没那么多需要重置。

③要使有序列表,无序列表前的黑点没有,需要用语句”list-style:none;”

④清除浮动(用前面写的方法)

2.开始写js里面的

自己要清楚,把这个psd分成了几部分(比如,头,脚,内容面板块)。用div块级元素,给他们分别命名成英文名字。(一般都用英文名,不用拼音,看起来高级一点)

每一部分的布局(是否居中,需要居中容器,应根据不同的psd进行调整)

在common里面写上js下的index的每一块的高度。

3.明日续

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/137441.html原文链接:https://javaforall.net

(0)
上一篇 2022年6月1日 下午11:46
下一篇 2022年6月1日 下午11:46


相关推荐

  • 如何在Pycharm上安装PyQt5[通俗易懂]

    如何在Pycharm上安装PyQt5[通俗易懂]这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好!这是你第一次使用Markdown编辑器所展示的欢迎页。如果你想学习如何使用Mar

    2022年8月25日
    9
  • cglib动态代理实现原理_java设计模式之代理模式

    cglib动态代理实现原理_java设计模式之代理模式代理模式(ProxyPattern)是一种结构性模式。代理模式为一个对象提供了一个替身,以控制对这个对象的访问。即通过代理对象访问目标目标对象,可以在目标对象实现的基础上,增强额外的功能操作,即扩展目标对象的功能。文章目录代理模式静态代理动态代理cglib代理应用

    2022年10月16日
    4
  • 关于AI绘画软件Midjourney的详细介绍

    关于AI绘画软件Midjourney的详细介绍

    2026年3月15日
    4
  • 多线程锁的升级原理是什么?

    多线程锁的升级原理是什么?多线程锁的升级原理是什么?锁的级别从低到高:无锁->偏向锁->轻量级锁->重量级锁锁分级别原因:没有优化以前,sychronized是重量级锁(悲观锁),使用wait和notify、notifyAll来切换线程状态非常消耗系统资源;线程的挂起和唤醒间隔很短暂,这样很浪费资源,影响性能。所以JVM对sychronized关键字进…

    2022年6月21日
    39
  • iOS 中 Touch ID得使用方法「建议收藏」

    iOS 中 Touch ID得使用方法

    2022年1月27日
    49
  • android10锁屏时钟样式,三星s10息屏时钟[通俗易懂]

    android10锁屏时钟样式,三星s10息屏时钟[通俗易懂]三星s10息屏时钟设置软件相当的方便强大,是不是设置息屏时钟太麻烦了,或者横竖屏总是错乱不尽人意?不用再在网上找各种攻略啦,这款软件可以直接帮助你修改息屏时钟,一键操作设置即可!同时这款软件中还有这更多的炫酷功能,图标壁纸时钟主题等等自定义和制作功能相当的强大!喜欢的朋友们不要错过哦!赶快下载三星s10息屏时钟开始体验吧!三星s10息屏时钟介绍三星s10息屏时钟软件app是一款提取版三星s10息屏…

    2026年4月18日
    7

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号