zoukankan      html  css  js  c++  java
  • HTML+CSS注意点

    1. 对于中文网页,需要在header中使用<meta charset="utf-8">声明编码,否则会出现乱码。

    2. 属性

    属性描述
    class 为html元素定义一个或多个类名(classname)(类名从样式文件引入)
    id 定义元素的唯一id
    style 规定元素的行内样式(inline style)
    title 描述了元素的额外信息 (作为工具条使用)

    3.  *{margin:0; padding:0;}的使用

      * 代表通配符,代表HTML的所有元素。为了兼容性考虑,因为页面上有些元素具有默认的margin、padding值,通过上面的语句可以去掉默认值。

      测试如下:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <style>
    #div1{
            float:left;
            width: 30%;
            height: 300px;
            background-color: #99FF99;
        }
    #div2{
            margin-left:30%; 
            width: 70%;
            height: 300px;
            background-color: #99FFFF;
        }
        </style>
    </head>
    <body>
    <div id="div1">1</div>
    <div id="div2">2</div>
    </body>
    </html>

      页面的两边会有空白。因为body元素具有margin值。

      如果,在style中加入 *{margin: 0; padding: 0;} ,页面两边的空白就会消失。

    4. HTML的style属性

      style作用:提供了一种改变所有HTML元素的样式的通用方法。

      避免使用下面的标签和属性:请使用样式代替

      

    标签描述
    <center> 定义居中的内容。
    <font> 和 <basefont> 定义 HTML 字体。
    <s> 和 <strike> 定义删除线文本
    <u> 定义下划线文本
    属性描述
    align 定义文本的对齐方式
    bgcolor 定义背景颜色
    color 定义文本颜色

      bgcolor -> background-color (为元素定义了背景颜色)

      font ->  font-family、color以及font-size属性分别定义元素中文本的字体系列、颜色和字体尺寸。

      align -> text-align (规定了元素中文本的水平对齐方式)

    5. 使用样式

      三种方法插入样式表:外部样式表内部样式表内联样式

    6. 链接

      通过<a>标签在HTML中创建链接。有一下属性:

      href 属性 - 创建指向另一个文档的链接

      name 属性 - 创建文档内的书签,也可以规定锚(anchor)的名称

      target 属性 - 定义被链接的文档在何处显示,如_blank,在新窗口打开文档

      样式:text-decoration:none 可以让链接没有下划线

    7. 块

      <div>

    8. 设置页面占满整个浏览器

    html {
    height: 100%
    }

    body {
    margin: 0 auto;
    padding: 0;
    height: 100%;
    }

  • 相关阅读:
    通过kettle数据导入mysql时,空值的处理在插入mysql时,会自动转转换为null值,无法插入
    centos 安装配置kettle
    centos服务器安装配置Postgre9.6
    python 获取随机字母
    defaultdict & Counter
    PIL 安装及使用
    python之yield和Generator
    Win7系统中用anaconda配置tensorflow运行环境
    #基础概念#之tensor
    python 生成特定间隔数列的方法
  • 原文地址:https://www.cnblogs.com/FocusIN/p/6476654.html
Copyright © 2011-2022 走看看