H5网页布局+css代码美化,零基础参考
HTML5的结构化标签,对搜索引擎更友好
li 标签对不利于搜索引擎的收录,尽量少用
banner图片一般拥有版权,不需要搜索引擎收录,因此可以使用ul + li
<samp></samp>可用于浅色副标题
display:inline-block; 每个导航块存在水平间隙,解决方法是在父元素上添加font-size:0;
sublime安装csscomb插件
选中css代码,ctrl+shift+c 自动整理好代码
排序前:
排序后:
此时存在多余的空行
解决方法:
安装cssformat插件,对代码执行edit->cssformat->expanded 即可删除空行
选中单句样式前面的空白部分(即tab空位)
然后alt+f3 会统一选中所有tab留白
按一次删除,再按一次删除,再空一格
此时这个效果:
然后按向下箭头,按向左箭头,按删除一次,再加个空格
此时效果
再向下箭头,再删除
此时效果
css样式代码美化完毕。
新标签元素的浏览器兼容解决:
最后晒出所有代码
index.html
style.css
效果图
原文链接:https://www.cnblogs.com/chenyingying0/p/12250255.html
喜欢小编的可以点个赞关注小编哦,小编每天都会给大家分享文章。
我自己是一名从事了多年的前端老程序员,小编为大家准备了新出的前端编程学习资料,免费分享给大家!
如果你也想学习前端,可以观看【置顶】文章。也可以私信【1】 领取最新前端练手实战项目
用HTML怎么制作网页呢?
用HTML怎么制作网页呢?静态网站的编写主要是用HTML DIV+CSS JS等来完成页面的排版设计 ,常用的网页设计软件有Dreamweaver、EditPlus、HBuilderX、VScode 、Webstorm、Animate等等,用的最多的还是DW,当然不同软件写出的前端Html5代码都是一致的。
一、网站布局方面:计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。
二、网站程序方面:计划采用最新的网页编程语言HTML5+CSS3+JS程序语言完成网站的功能设计。并确保网站代码兼容目前市面上所有的主流浏览器,已达到打开后就能即时看到网站的效果。
三、网站素材方面:计划收集各大平台好看的图片素材,并精挑细选适合网页风格的图片,然后使用PS做出适合网页尺寸的图片。
四、网站文件方面:网站系统文件种类包含:html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件;
五、网页编辑方面:网页作品代码简单,可使用任意HTML编辑软件(如:Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作)。 其中: (1) html文件包含:其中index.html是首页、其他html为二级页面; (2) css文件包含:css全部页面样式,文字滚动, 图片放大等; (3) js文件包含:js实现动态轮播特效, 表单提交, 点击事件等等(个别网页中运用到js代码)。
不会前端编程也能做网页一款强大的低代码可视化 H5 搭建平台
这次介绍的这款开源项目很适合当前网风下,只想鼠标点点点,就完成很多事情(包括开发)的现实。这款开源的产品叫作“H5-Dooring”。
项目的官网是:https://github.com/MrXujiang/h5-Dooring
关于该产品的介绍,项目的readme是这样描述的:
H5-Dooring是一款功能强大,专业可靠的H5可视化页面配置解决方案,致力于提供一套简单方便、专业可靠、无限可能的H5落地页最佳实践。技术栈以react和typescript为主, 后台采用nodejs开发, 正在探索h5-lowcode解决方案。
下面是我自己的部署步骤,使用的系统是ubuntu24.04
这些服务虽然在线仓库中都有,但是版本都比较旧,已经无法使用过程的npm仓库源了。采用官方的nvm办法进行安装,并指定到20的长期支持版。
先安装nvm这个nodejs的管理工具。
安装完成后,如果提示没有nvm命令,就重启一下服务器。
使用下面的命令进行安装:
设置国内的npm镜像源
使用npm安装yarn
进入创建一个目录并进入该目录,咱们拉取的代码将放在这个目录里面
从github上把本项目的代码拉取到本地
查看是否已经下载完成,下载完成的内容会如下:
进入到项目的目录中,执行下面的命令安装依赖关系
启动项目
在远程浏览器中输入 http://服务器IP+8000端口,就可以访问到H5搭建平台了。
本文作者及来源:Renderbus瑞云渲染农场https://www.renderbus.com
文章为作者独立观点不代本网立场,未经允许不得转载。