当前位置: 首页 > biancheng >正文

前端学习笔记整理(1)--html

  1. 设置div的样式,设置了背景图片(不平铺),背景图片的大小:
    style="background: url(../img/abc.jpeg) no-repeat;background-size: 100% 100%;fill: 100%;"
  2. 列表的特殊使用:
    <ul style="list-style: none;display: inline-flex">
     
    1. inline-flex:将对象作为内联块级弹性伸缩盒显示;
    2. list-style: none:除去UL,OL前面的样式,比如小圆点,罗马数字,放宽
  3. 设置空格:
    &nbsp
  4. id不要用数字,用英文
  5. 事件的使用(点击图片更新):
    <img src="../img/验证码1.png" style="width: 280px;height: 35px;" onclick="this.src='../img/验证码2.png'" />
  6. 设计下拉框:
        <select>
            <option>一月</option>
            <option>二月</option>
            <option>三月</option>
        </select>月
  7. 设计单选:
    <input type="radio" name="ifchakan" value="1"/>是
    <input type="radio" name="ifchakan" value="0"/>否
  8. 多选:
    <input type="checkbox" />大屏幕电视机
  9. 表格:
    table width="760px" height="250" border="1" align="center">
        <tr>
    		<td rowspan="3">//占三行,相当于合并单元格
    		    <!--单元格1-->
    		    <img src="../img/back.png" / width="260" height="190">
    		</td>
    		<td rowspan="3">
    		    <img src="../img/fly.jpg" / width="253" height="186">
    	        <!--单元格2-->
    		</td>
    		<td>
    			设为首页
    		</td>
    	</tr>
    	<tr>
    		<td>
    			联系站长
    		</td>
    	</tr>
    	<tr>
    		<td>
    			加入收藏
    		</td>
    	</tr>
    	<tr>
    		<td colspan="3">//占3列
    			首页 基础知识 高级编程
    		</td>
    	</tr>
    </table>
  10.  浮云效果:
    <marquee>
        <img src="img/fly.jpg" width="50" height="50"/>
    </marquee>

相关文章:

  • 牛客练习赛#84 F 莫比乌斯反演+杜教筛+技巧+斐波那契数列和gcd的结论+矩阵快速幂
  • ZZNUOJ_用C语言编写程序实现1342:支配值数目(附完整源码)
  • java毕业设计后勤管理系统餐饮评价监督系统(附源码、数据库)
  • 前端基础学习笔记
  • 【TS】联合类型--类型断言--类型推断
  • 谈笑风声的秘密
  • QT影城网上售票系统
  • NetCDF数据在ArcMap中的使用
  • 打怪升级(考验思路)
  • 持续精进,改变自己