律师网站设计基础:HTML标签区别

来源: 发布时间:2020-07-27 浏览:54
(一)三表 用途  
list列表 整齐布局 ul先到先得,ol有序排列,还有个自定义【dl>dt>dd
table列表 展示数据结构 【caption table>th/tr>td(thead标题 tbody数据 tfoot脚注)】
    border/cellspacing/cellpadding表格边框/相邻单元格外边间距/单元格内外边间距三参为0(去重叠可用border-collapse)】
    【跨单元格 柱列colspan 横行rowspan】
form表单 收集用户信息 表单域action--服务器脚本
    表单控件type="date" name maxlength
    提示信息<label for="">扩大热区<input id="">
    其他属性textarea/seclect/option
    checkbox的name=“ [ ]”加中括号表示告诉后台服务器脚本含多个值
  value 光标聚焦保留值,一并打包发送后台
  placeholder 仅作背景,光标输入自动去掉提示信息

(二)img图像,在律师网站设计中格式优先考虑webp>jpg>png>svg>png24>png8>gif

格式 特点 应用
①png 透明,文件大,色彩多 【小LOGO、透明背景】
png24 控制在40kb,色彩少  
png8 文件小,色彩单一  
②jpg 不透明,文件小,色彩中 【轮播/广告、大背景/产品】
  图片大小控制在40~200kb  
③gif 单一透明,色彩少 【动图】
④webp 透明动态,且文件小 【部分支持的浏览器,如Chrome】
⑤ico 字体图徽,文件小 【标签页title/小图徽】
⑥svg 缩放矢量,依赖代码<svg> 【可编辑,SEO爬虫可读取】

【1】插图和背景区别
①.前者为产品展示,移动位置靠盒模型margin padding
②.后者为小图标或超大背景图,只能通过background-position

【2】去除图片底侧空白
①思路:不让img、input行内块与父盒子基线对齐
②vertical:top 或 display:block

联系方式

电话:152-0832-9147

邮箱:105991110@qq.com

Q Q:105991110

地址:成都市人民南路四段27号商鼎国际2栋1单元2705

蜀ICP备18025242号-1 RSS

微信联系我们