HTML常用标签笔记(一)
对于我来说,CSS和html都是弱项,基本不会写,只会借用。今天收藏几段实用的代码,当然都是比较基础的代码。
1.img标签控制图片大小输出
2.input标签中type=button属性的使用:包括点击跳转网页,字体颜色变化。(亚马逊跳转aff链接能用到)
3.通过CSS实现链接按钮,跳转网页。(亚马逊跳转aff链接能用到,下载站按钮)
4.input标签控制鼠标悬停,改变颜色。
Html代码如下:
<html> <link href="style.css" rel="stylesheet" type="text/css"> <img src="https://www.baidu.com/img/dong_ca53b94625c757745bcb2c16461eb105.gif" width="75" height="50"> <input type="button" style="border-radius: 0.5rem; background-color: #eb4923; color:#ffffff; padding: 0.36rem 0.79rem; width: auto; font-family: "Helvetica Neue", Helvetica,Arial,sans-serif; cursor: pointer;" onclick="window.open('http://www.baidu.com');" value="Check Price" /> <div class="demo"><a href="http://www.baidu.com" target="_blank" rel="nofollow">Test BaiDu</a></div> <div class="download"><a href="http://www.baidu.com">Download BaiDu</a></div> <input type="button" class="input_out" onmousemove="this.className='input_move'" onmouseout="this.className='input_out'" value="提交" /> </html>
style.css中代码如下:
.demo a:link, .demo a:visited, .download a:link, .download a:visited{ margin-bottom:20px; background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #79bbff), color-stop(1, #378de5)); border-radius:5px; border:1px solid #337bc4; display:inline-block; color:#ffffff; font-family:Arial; font-size:20px; font-weight:bold; padding:15px 44px; text-decoration:none !important; } .input_out{width:60px;height:30px;border:1px solid #CCC; background-color:#FFF;} .input_move{width:60px;height:30px;border:1px solid #CCC; background-color:#79bbff;}