Html属性

来源：互联网发布：js复选框取消选中事件编辑：程序博客网时间：2024/04/30 14:54

input输入框

文件类型可以多选
name属性加[]
增加属性 multiple=”multiple”
form标签增加多文件上传属性
enctype=”multipart/form-data”

input 预留文字
placeholder=”输入项目名称搜索”

search类型
改变输入框占用文本的颜色

<style>    :-moz-placeholder { /* Mozilla Firefox 4 to 18 */        color: #f00;      }    ::-moz-placeholder { /* Mozilla Firefox 19+ */        color: #f00;    }    input:-ms-input-placeholder,    textarea:-ms-input-placeholder {        color: #f00;    }    input::-webkit-input-placeholder,    textarea::-webkit-input-placeholder {        color: #f00;    }    </style>

设置背景图片

<style type="text/css">.bk{    background-image: url(/photo2/1611.jpg);    background-repeat: no-repeat;    /*background-size: 100% 100%;*/}</style><body class="bk"></body>

select下拉框样式

<style>select {  /*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/  border: solid 1px #000;  /*很关键：将默认的select选择框样式清除*/  appearance:none;  -moz-appearance:none;  -webkit-appearance:none;  /*在选择框的最右侧中间显示小箭头图片*/  background: url("<?=base_url('images/home/xiajiantou.png');?>") no-repeat scroll right center transparent;  /*为下拉小箭头留出一点位置，避免被文字覆盖*/  padding-right: 14px;}</style>

文本超出自动隐藏属性

overflow: hidden;white-space: nowrap;text-overflow: ellipsis;

获取浏览器宽度

document.getElementById('container').style.width="210px";document.getElementById('container').style.width=parseInt(scrWidth)-parseInt(213)+"px";

网页logo图标

<link rel="icon" type="image/x-icon" href="/static/images/slogo.png">

H5获取坐标

<p id="demo">点击这个按钮，获得您的坐标：</p><button onclick="getLocation()">试一下</button><script>    var x=document.getElementById("demo");    function getLocation(){        if (navigator.geolocation){           navigator.geolocation.getCurrentPosition(showPosition);        }else{            x.innerHTML="Geolocation is not supported by this browser.";        }    }    function showPosition(position)    {        x.innerHTML="Latitude: " + position.coords.latitude +"<br />Longitude: " + position.coords.longitude;    }</script>

H5页面窗口自动调整到设备宽度，并禁止用户缩放页面

<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />

0 0