• Css-基础


    频繁使用标签属性处理

    *{margin:0;padding:0}//所有标签清除margin,padding值
    a{text-decoration:none;}//清除下划线
    li{list-style:none}//清除li默认
    img{display:block}//图片块元素
    input{float:left}//不同浏览器表单高度不一样
    cursor:pointer//手壮鼠标

    Web标准:结构(xhtml)==表现(css)==行为(js)缺一不可

    网站实现过程

    注册域名(网址)->租用空间(网址文件)->网站建设(html)->网站推广(SEO)->网站维护(更新..网站编辑)

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
        <body>
            </body>
    </html>

    常用的 DOCTYPE 声明 

    HTML 5 
    <!DOCTYPE html> 
    HTML 4.01 Strict 
    该 DTD 包含所有 HTML 元素和属性,但不包括展示性的和弃用的元素(比如 font)。不允许框架集(Framesets)。 
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
    HTML 4.01 Transitional 
    该 DTD 包含所有 HTML 元素和属性,包括展示性的和弃用的元素(比如 font)。不允许框架集(Framesets)。 

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 

    HTML 4.01 Frameset 
    该 DTD 等同于 HTML 4.01 Transitional,但允许框架集内容。 
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" 
    "http://www.w3.org/TR/html4/frameset.dtd"> 
    XHTML 1.0 Strict 
    该 DTD 包含所有 HTML 元素和属性,但不包括展示性的和弃用的元素(比如 font)。不允许框架集(Framesets)。必须以格式正确的 XML 来编写标记。 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

    xmlns 属性在 XHTML 中是必需的。不过即使你的 XHTML 文档没有使用此属性,W3C 的验证器也不会报错。因为 "xmlns=http://www.w3.org/1999/xhtml" 是一个固定值,所以,即使你没有包含它,此值也会被添加到 <html> 标签中。 

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    声明内容编码类型:为了被浏览器正确解释和通过W3C代码校验,所有的XHTML文档都必须声明它们所使用的编码语言,我们一般使用gb2312(简体中文)或utf-8(国际编码),制作多国语言页面也有可能用Unicode、ISO-8859-1等,根据你的需要定义。 


    <meta http-equiv="Content-Language" content="zh-CN" /> 
    //声明网页采用的语言 



    <meta name="author" content="Hello" /> 
    //声明作者名字 



    <meta name="copyright" content="" /> 
    //声明版权信息 



    <meta name="keywords" content="" /> 
    //声明网页关键字:关键字中间用英文逗号隔开 



    <meta name="description" content="meta是html语言head区的一个辅助性标签。" /> 
    //声明对网站的简单描述信息 
    后面两行主要是被百度这些搜索网站检索的时候用的,对SEO非常重要! 
    前端开发的时候,如果不指定文件类型,你的HTML不是合法的HTML,并且大部分浏览器会用“怪癖模式(quirks mode)”来处理页面,这意味着浏览器认为你自己也不知道究竟做什么,并且按浏览器自己的方式来处理你的代码。你能是个HTML大师,在地球上打遍天下无敌手,或你的HTML能无瑕疵,CSS能非常完美,但如果没有文件声明,或错误的文件声明,你的网页和一个短视的,独眼的长臂猿婴儿十分艰难地堆砌起来的没两样。 

          要想写出跨浏览器的CSS,必须知道浏览器解析CSS的两种模式:标准模式(strict mode)和怪异模式(quirks mode)。 
    所谓的标准模式是指,浏览器按W3C标准解析执行代码;怪异模式则是使用浏览器自己的方式解析执行代码,因为不同浏览器解析执行的方式不一样,所以我们称之为怪异模式。浏览器解析时到底使用标准模式还是怪异模式,与你网页中的DTD声明直接相关,DTD声明定义了标准文档的类型(标准模式解析)文档类型,会使浏览器使用相应的方式加载网页并显示,忽略DTD声明,将使网页进入怪异模式(quirks mode)。 

    标准模式中IE6不认识!important声明,IE7、IE8、Firefox、Chrome等浏览器认识;而在怪异模式中,IE6/7/8都不认识!important声明,这只是区别的一种,还有很多其它区别。 
    头部声明是HTML页面非常重要的一部分,有些标签在4.0的声明不起作用,在html5可以,所以,在前端编写代码的时候,注意头部声明的选择和兼容性控制。

    <img src="目标文件路径·及全称" alt='图片替换文本' title='鼠标悬停图片标题'/>
    <a href="http://网址/">超链接</a>

    target="_blank" ===新窗口打开

    target="_self"===当前窗口打开

    可加title鼠标悬停显示

    <table border="边框" cellspacing="单元格间距" cellpadding="单元格空隙" width="" height="">
        <tr>//行
            <th>Header</th>//列
        </tr>
    </table>

    水平对齐方式:align=‘left/center/right’

    垂直对齐方式:valign='top/middle/bottom'

    列合并:colspan='列数'

    行合并:rowspan='行数'

    <form action="路径、网址" method="get/post请求" name="">
        <input type="submit" value=""/>
    </form>

    表单框 :

      placeholder框内提示字体样式为灰色,输入内容后消失

    <input type="text" name="" id="" value=""/>

    单行文本框

    <input type="password" name="" id="" value="" />

    密码框 

    <input type="submit" name="" id="" value="" />
    <button></button>

    提交按钮

    <input type="reset" name="" id="" value="" />

    重置按钮

    <select name="">
        <option value=""></option>
    </select>

    下拉框

    <textarea name="" rows="" cols=""></textarea>

    多行文本框

    <input type="checkbox" name="" id="" value="" />

    复选框 disabled属性禁用此框   checked默认

    <input type="radio" name="" id="" value="" />

    单选框 多个单选框的情况下 name属性值要一样

  • 相关阅读:
    转:二进制文件和文本文件的区别详解
    python sorted函数,字典排序
    office word交叉引用,文献尾注,公式自动编号
    list作为实参传给函数
    转:python深拷贝和浅拷贝的区别
    文件夹中含有子文件夹,修改子文件夹中的图像存储格式(python实现)
    python遍历文件夹中所有文件夹和文件,os.walk
    cf div3 B Obtaining the String
    cf div3 B Obtaining the String
    poj 3281(最大流)
  • 原文地址:https://www.cnblogs.com/weilizou/p/10788900.html
Copyright © 2020-2023  润新知