李生晓-20201028

HTML5.0:H5--标签(块级标签:P ul div  行级标签 a span ing)
         表单
区别:块级:占一整行
          行级:内容多大,标签多大
CSS3.0 层叠样式表-修饰网页
           选择器:(镜子):精确选中修饰目标
           常用地选择器:
1,,类选择器 <div class="box"></div>
           用颜色定义 首先设置大小
box{
    width: 300px;
    height: 200px;
    background-color: red;
}
2 ,标签选择器:
 h1{
    width: 300px;
    height: 200px;
    background-color: #11aabb;
}
3, id 选择器
box{
    width: 300px;
    height: 200px;
    background-color: red;
    
   3高于1高于2
4, 后代选择器
.p ul li{
    color:black
}

5,伪类选择器(鼠标悬停状态)hover
6,通用选择器(优先级最低)只用一次
*{
    margin: 0;/*外边距*/
    padding: 0;/*内边距*/
    border: 0;/*边框*/
修饰字体和文本的常用样式
当同时选中时优先使用优先级高的
.box{
    width: 300px;
    height: 200px;
    border :1px #00002 solid;
}
.div{
    color:red;/*修饰字体的颜色*/
    font-size:  30px;/*修饰字体的大小*/
    font-style: italic;/*字体的样式*/
    font-family: "宋体";/*字体类型*/
    font-weight: bold1;/*字体加粗*/
    letter-spacing: 5px;/*字体间距*/
    
    text-align: center;/*对齐方式*/
    line-height: 300px;/*行高*/
    text-decoration: underline;/*文本划线*/
                text-shadow: 2px 2px 3px yellow;/*字体阴影*/
    text-indent: 2em;/*首行缩进*/
}
修饰背景的常用样式
background-color: red;/*背景颜色*/
    background-image: url(../js/4BACEA7C993D29F2AFD60B4AE0172791.jpg);/*背景图片*/
    background-size:cover ;/*背景图片大小*/
    background-repeat-x:cover ;/*背景图片平铺*/
    background-position:-100px 0;/*背景图片平移*/
颜色表示方法
三位表示000-fff
六位表示000000-ffffff
rgb 表示(000 000 000-255 255 255)
rgba (0,255,255,0,3)透明度
图片透明 opacity:0.2;/*透明度*/

心得体会:
今天学习了6类选择器 类选择器 类选择器 id 选择器 后代选择器 伪类选择器 通用选择器,进度有些快但是还能接受需要不断练习才能熟悉选择器的运用。
下午学习了修饰字体和文本的常用样式。还学习到修饰背景的常用样式,虽然有些难,但我依然会尽最大努力去学习!

标签

评论


© 2021 成都云创动力科技有限公司 蜀ICP备20006351号-1