zoukankan      html  css  js  c++  java
  • day3-html+css

    一,css的引入方式
     3种,外部(外联式) 
              内部(内链式)
              行内式
    二,演示格式
    外部式:
    <link rel="stylesheet" href="./css/01.css">
    内部式:
    <style>
    p{
    background:pink;
    font-size:50px;
    color:green;
    }
    h4{
    }
    ......
    </style>
    行内式:
    <div style='color:pink'>文本</div>
    三,字体属性
    1,font-size:字号大小
    例:font-size:45xp;
    
    2,font-family:字体
    例:font-family:"微软雅黑";
    属性值:略
    常用技巧
    1. 现在网页中普遍使用14px+2. 尽量使用偶数的数字字号。ie6等老式浏览器支持奇数会有bug。
    3. 各种字体之间必须使用英文状态下的逗号隔开。
    4. 中文字体需要加英文状态下的引号,英文字体一般不需要加引号。当需要设置英文字体时,英文字体名必须位于中文字体名之前。
    5. 如果字体名中包含空格、#、$等符号,则该字体必须加英文状态下的单引号或双引号,例如font-family: "Times New Roman";。
    6. 尽量使用系统默认字体,保证在任何用户的浏览器中都能正确显示。
    3,font-weight:字体粗细
    例:font-weight:bord;   
    属性值(normal、bold、bolder、lighter、100~9004,font-style:字体风格
    属性值:(normal:默认值 italic:斜体 oblique:倾斜的字体)
    5,font-color:字体颜色
    例:font-color:red
    6,font:综合设置字体样式
    选择器{font: font-style  font-weight  font-size  font-family;}
    例:{font:斜体 粗体 45px 微软雅黑;}
    四,文档属性及属性值
    1,line-height:行间距
    例:line-height:100px;
    属性值单位分别为像素px,相对值em和百分比%
    2,text-align:水平对齐方式
    例:text-align:center;
    属性值:(left:左对齐(默认值) right:右对齐 center:居中对齐)
    3,text-indent:首行缩进
    例:text-indent:2em;(一个汉字就是一个em)
    4,text-decoration 文本的装饰
    例:text-decoration:underline;
    属性值:(none:默认;underline:下划线;overline:上划线;line-through:删除线)
    none可以去除超链接自带的下划线
    五,选择器
    例:* {
    margin: 0;                    /* 定义外边距*/
      padding: 0;                   /* 定义内边距*/
    }
    交集选择器(h3标签内有这个类名的拥有这个属性)
    交集选择器由两个选择器构成,其中第一个为标签选择器,第二个为class选择器,两个选择器之间不能有空格,如h3.special
    
    并集选择器(h3标签和拥有这个类名的标签都有这些属性)
    
    后代选择器(标签内都拥有这些属性)
    
    子元素选择器(这个标签的子代拥有这些属性)

  • 相关阅读:
    鬼谷子 简单飞扬
    JavaScript 随笔汇集 简单飞扬
    p2p学习 简单飞扬
    p2p知识 简单飞扬
    使用 JFreeChart来创建基于web的图表 简单飞扬
    Javascript中最常用的55个经典技巧 简单飞扬
    庆祝在博客园申请博客成功
    读《WCF技术剖析》(卷一)笔记(一)
    常用字符串截取类
    创建yum本地源 转帖
  • 原文地址:https://www.cnblogs.com/adylz111/p/13433415.html
Copyright © 2011-2022 走看看