2018-09-19-day3作业

/*1.字体相关的属性
             * 字体颜色:color
             * 字体大小:font-size
             * 字体名:font-family
             * 字体加粗:font-weight(bolder(更粗的)/bold(加粗)/normal(常规)/100—900)
             * 字体倾斜:font-style(italic/oblique/normal)
             */
            p{
                font-family:"微软雅黑";
                font-weight: 100;
                font-style: italic;
            }
            /*2.对齐方式:text-align
             * left:左对齐
             * right:右对齐
             * center: 水平方向居中
             */
            p{
                text-align: left;
            }
            /*3.行高:line-height
             * 设置一行的高度
             */
            p{
                /*一行内容在垂直方向上居中,可以通过将line-height的值设置为和height的值一样*/
                line-height: 100px;
            }
            
            /*4.文本修饰:text-decoration
             * none: 取消修饰
             * underline:下划线
             * overline:上划线
             * line-through:删除线
             */
            a,p{
                text-decoration: none;
            }
            a:hover{
                text-decoration: underline;
                color: red;
            }
            
            /*5.首行缩进:text-indent
             * 注意单位是:em(表示空格)
             */
            p{
                text-indent: 2em;
            }
            
            /*6.字间距:letter-spacing
             * 单位可以是:px,em
             */
            p{
                letter-spacing: 2px;
            }
            
            /*7.列表相关的*/
            ul{
                /*margin-left: 100px;*/
                /*list-style-type: none;*/
                list-style-image:url(img/luffy2.png);
                list-style-position:inside;
            }
            
            /*8.背景图片
             * background:图片地址 是否平铺 x方向的坐标 y方向的坐标 背景色
             */
            #div{
        
                width: 300px;
                height: 200px;
                /*background-image: url(img/luffy4.jpg);*/
                background: url(img/luffy2.png) no-repeat center 0px yellow;
                
            }
            /*9.设置圆角*/
            #div{
                /*border-bottom-left-radius: 10px;
                border-radius: 30px;*/
                border-radius: 10px 100px;
                
                border:3px solid red;
            }
    ```
网页结果
![QQ截图20180919210446.png](https://upload-images.jianshu.io/upload_images/13692301-2852527251abaf75.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

你可能感兴趣的:(2018-09-19-day3作业)