移动端----CSS基础设置

<html>

<head>
    <meta charset="utf-8">
    <title>移动端----CSS基础设置</title>
    <meta name="keyword" content="移动端----CSS基础设置">
    <meta name="discription" content="移动端----CSS基础设置">
    <style>
    body {
        font-family: "Helvetica Neue", Helvetica, STHeiTi, sans-serif;
        /*使用无衬线字体*/
    }

    a,
    img {
        -webkit-touch-callout: none;
        touch-callout: none;
        /*禁止长按链接与图片弹出菜单*/
    }

    html,
    body {
        -webkit-user-select: none;
        user-select: none;
        /*禁止选中文本*/
    }

    button,
    input,
    optgroup,
    select,
    textarea {
        -webkit-appearance: none;
        /*去掉webkit默认的表单样式*/
    }

    a,
    button,
    input,
    optgroup,
    select,
    textarea {
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
        /*去掉a、input和button点击时的蓝色外边框和灰色半透明背景*/
    }

    input::-webkit-input-placeholder {
        color: #ccc;
        /*修改webkit中input的planceholder样式*/
    }

    input:focus::-webkit-input-placeholder {
        color: #f00;
        /*修改webkit中focus状态下input的planceholder样式*/
    }

    body {
        -webkit-text-size-adjust: 100%!important;
        /*禁止IOS调整字体大小*/
    }

    input::-webkit-input-speech-button {
        display: none;
        /*隐藏Android的语音输入按钮*/
    }
    </style>
</head>

<body>
</body>

  

原文地址:https://www.cnblogs.com/SunlikeLWL/p/8793540.html

时间: 2024-11-08 23:11:35

移动端----CSS基础设置的相关文章

css基础 设置背景 背景色 背景图片 不平铺 背景图片在x、y轴上的位置

镇场诗: 清心感悟智慧语,不着世间名与利.学水处下纳百川,舍尽贡高我慢意. 学有小成返哺根,愿铸一良心博客.诚心于此写经验,愿见文者得启发.------------------------------------------ code: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"

css基础 设置div块的上下左右的内填充距离padding(缩写形式)

镇场诗: 清心感悟智慧语,不着世间名与利.学水处下纳百川,舍尽贡高我慢意. 学有小成返哺根,愿铸一良心博客.诚心于此写经验,愿见文者得启发.------------------------------------------ code: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"

css基础 设置div块的上下左右外填充距离margin(缩写形式)

镇场诗: 清心感悟智慧语,不着世间名与利.学水处下纳百川,舍尽贡高我慢意. 学有小成返哺根,愿铸一良心博客.诚心于此写经验,愿见文者得启发.------------------------------------------ code: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"

css基础 设置div 上下左右边框线的样式

镇场诗: 清心感悟智慧语,不着世间名与利.学水处下纳百川,舍尽贡高我慢意. 学有小成返哺根,愿铸一良心博客.诚心于此写经验,愿见文者得启发.------------------------------------------ code: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"

CSS基础学习十四:盒子模型补充之display属性设置

我在CSS基础学习十三:盒子模型的i博文只是阐释了CSS盒子模型,并没有过多的使用实例来演示.这篇博文 就来做一些盒子模型知识的补充.这一部分对于网页总体布局还是蛮重要的,过去大多数使用HTML中的table元素和 框架标签来进行网页的整体布局,现在我们使用最多的是DIV+CSS网页布局.所以一定要掌握好盒子模型,记住 content,border,padding和margin各自在盒子中的作用和使用方式. 先来看一个完整元素的盒子模型实例: <!DOCTYPE html PUBLIC "

Html5开发——html+css基础一(百度首页)

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>百度</title> <style type="text/css"> *{margin: 0;padding: 0;} body{text-align: center;} .header{text-align: right;f

css基础不扎实

写了两周的网页,发现自己的css基础还是很差的,当时培训学习的时候就发现了,我做的页面都特别的别扭和丑吧,在班级上应该是垫底的: 原先只知道用float,不会使用定位,网页连固定定位也不会,现在发现,原来手机移动端,使用的多的是绝对定位,相反浮动也就没有那么多的. 浮动后的元素,其父级元素如果想让其内容自动撑开,就得使用清楚浮动了,具体办法就是 div:before和div:after content: ""; clear: both; display: block; height: 

移动端-项目基础总结------彭记(020)

移动端的项目已经做过好几个了,在这里做个简单的知识小总结 移动端常用类库及优缺点 1. jQuery Mobile 是 jQuery 发布的针对手机和平板设备.经过触控优化的 Web 框架.它基于 jQuery,在不同移动设备平台上可提供统一的用户界面.该框架基于渐近增强技术,并利用 HTML5 和 CSS3 特性.Query Mobile 继承了 jQuery 的优势,并且提供了丰富的适合手机应用的 UI 组件.jQuery Mobile 还有很多的第三方扩展. 2. Zepto.js 是支持

HTML3/CSS基础

1. HTML 1.1 什么是HTML HTML是用来制作网页的标记语言 HTML是Hypertext Markup Language的英文缩写,即超文本标记语言 HTML语言是一种标记语言,不需要编译,直接由浏览器执行 HTML文件是一个文本文件,包含了一些HTML元素,标签等 HTML文件必须使用.html或.htm为文件名后缀 HTML是大小写不敏感的,HTML与html是一样的 HTML是由W3C的维护的 HTML 是通向 WEB 技术世界的钥匙. 1.2 发展历史 HTML是从2.0版