常见容易遗漏的html标签

<link href="favicon.ico" mce_href="/favicon.ico" rel="bookmark" type="image/x-icon" />
<link href="favicon.ico" mce_href="/favicon.ico" rel="icon" type="image/x-icon" />
<link href="favicon.ico" mce_href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
// 添加favicon

<meta content=”width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;” name=”viewport” />
// 保证文档与设备宽度比例相同,不允许放大缩小页面

<meta content=”yes” name=”apple-mobile-web-app-capable” />
// iPhone中的Safari私有属性,允许全屏浏览

<meta content=”black” name=”apple-mobile-web-app-status-bar-style” />
// iPhone中的Safari私有属性,定制顶部状态栏的颜色
// content值有三个:default、black、black-translucent。

<meta content=”telephone=no” name=”format-detection” />
// iPhone中的Safari私有属性,禁止电话号码识别
// 如果允许识别,Safari将自动将号码转为<a href="tel://号码">号码</a>,可将针对a标签设置样式

<input autocapitalize="off" />
// 禁止IOS键盘首字母大写

<meta content=”email=no” name=”format-detection” />
// 禁止Android自动识别邮箱地址

* {
    -webkit-touch-callout;
    // 禁止IOS弹出列表按钮,写这个,同样也会禁止用户复制下载图片

    -webkit-user-select;
    // 禁止IOS用户选中文字
}

@media screen and (orientation: portrait) {
}
/* 竖屏时使用的样式 */

@media screen and (orientation: landscape) and ( max-width: 1023px) {
    body {
        positon: relative;
        height: 100%;
        width: 100%;
        overflow: hidden;
        * {
            visibility: hidden !important;
        }
        &:before {
            content: ‘!!!禁止使用横屏,竖屏浏览更佳‘;
            position: absolute;
            top: 50%;
            left: 0;
            width: 100%;
            padding: 50px;
            text-align: center;
            font-size: $_FS_30;
            font-family: $_FF_Arial;
            @include translate(0, -50%);
        }
    }
}
/* 横屏时使用的样式 */
时间: 2024-09-28 18:49:51

常见容易遗漏的html标签的相关文章

前端开发中最常见的12个HTML标签错误(其实也不一定就错,只是这样写不太好)

开发者在写HTML代码的时候一定要仔细,并熟练掌握HTML规则,因为一不留神则可能出现一些微小的错误,但有可能会导致严重的后果. http://www.iteye.com/news/26074本文列举了一些在HTML中常见的错误,并且给出了如何避免错误的方法.相信这些方法会对前端开发者有一些帮助. 错误1:嵌套错误 正确使用HTML tag的结束标记非常重要,HTML tag的结束标记的顺序要和开始标记一致,而新手往往会忽视这点.如果顺序不对,系统会出现验证错误并且得不到预期的结果.因此,要注意

常见的几个meta标签元素

1.指定字符集: <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 2.向搜索引擎说明你的网页的关键字: <meta name="keywords" content="关键字"/> 3.告诉搜索引擎你的站点的主要内容: <meta name="description" content=&qu

常见文本样式及标签

本文设计到常见对文档的处理样式,和块,行标签的特点. 没用什么重要内容,只是自己的一些知识点的回忆,对以前知识的一个梳理过程,望某懒虫加油!!! <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>文本样式和块.行.内敛标签</title> <style> div{ color: red; /*这

HTML5中新加的标签和属性定义

HTML5 <!DOCTYPE> 标签所有主流浏览器都支持 <!DOCTYPE> 声明.<!DOCTYPE> 声明非常重要,它是一种标准通用标记语言的文档类型声明,通过该标签,浏览器能够了解HTML5文档正在使用的HTML规范,<!DOCTYPE> 声明是HTML5文档的起始点,也就是说它必须位于HTML5文档的第一行!标签定义及使用说明:<!DOCTYPE> 声明位于文档中的最前面的位置,处于 <html> 标签之前.<!DO

a 标签中调用js的几种方法

我们常用的在a标签中有点击事件:1. a href="javascript:js_method();" 这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放.W3C标准不推荐在href里面执行javascript语句 2. a href="javascript:void(0);"

【JS】&lt;a&gt;标签调用js中函数的几种方法

我们常用的在a标签中有点击事件: a href="javascript:js_method();" 这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放.W3C标准不推荐在href里面执行javascript语句 a href="javascript:void(0);" oncl

selenium 总结篇,常见方法和页面元素的操作

今天,总结一下selenium怎么操作web页面常见的元素. 主要有: 上传 alter dialog prompt dialog confirm dialog select list radio box input box checkBox 测试页面如下: 1 <html> 2 <head> 3 <title>selenium处理基本页面元素</title> 4 <style type="text/css"> 5 table

Struts2中UI标签之表单标签介绍

1.在Struts2中UI标签的表单标签分为两种:form标签本身和单个表单标签. 2.Struts2表单标签包括:form.textfield.password.radio.checkbox.checkboxlist.select.doubleselect.combobox.optiontransferselect.optgroup.updownselect.textarea.hidden.file.label.submit.token.head.datepicker.reset.richte

关于在&quot;a&quot;标签中添加点击事件的一些问题

昨天做修改页面跳转时遇到一个问题,如果a标签的"href"属性为空的话,比如这样<a href="" onclick="roleupdate()">修改</a>,这时当我点击修改链接时并没有给我跳到对应修改页面,而是只在本页面进行了刷新操作:如果写成<input type="button" onclick="roledelete()" value="修改"&