align和text-align有什么区别吗,或者二者的使用场景都是哪些?
你好,老师。form标签里书写的内容是不是不会自动换行
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .box{ width: 50px; height: 50px; background-color: cornflowerblue; font-size: 12px; animation: Rotating 5s linear 1; } @keyframes Rotating { 0%{ } 25%{ transform: rotate(90deg); } 50%{ transform: translateX(300px); } 75%{ background-color: #ff5500; } 100%{ transform: translateX(0); } } </style> </head> <body> <div class="box">一个盒子宽高都是50</div> </body> </html>
为什么我旋转了,移动的时候它又转回去了。
没有提到优先级么
这个软件去哪里找?我到官网下载的,好像没有上面这些东西
<div class="conetnt-title">推荐餐厅</div> <div class="conetnt"> <div class="items"> <div class="items-top"> <img src="img/xl-logo2x.png" alt=""> <p>商家标题一</p> <p>人均:¥20.00 |10人预订</p> <p> <i class="iconfont"></i> <i class="iconfont"></i> <i class="iconfont"></i> <i class="iconfont"></i> <i class="iconfont"></i> </p> </div> </div> <div class="items-bottom">南屏街金马坊</div> </div> </div>
.conetnt-title{ width: 100%; height: 25px; padding-left: 10px; box-sizing: border-box; color: #017e5c; text-align: left; line-height: 25px; background-color: #eee; } .conetnt{ padding: 10px; box-sizing: border-box; } .items{ width: 100%; height: 110px; } .items-top{ width: 100%; height: 80px; background-color:red; display: flex; } .items-bottom{ width: 100%; height: 30px; background-color: #eee; text-align: left; line-height: 30px; color: #a6a6a6; } .items-top>img{ width: 75px; height: 75px; margin: 5px 15px 5px 5px; }
老师,这个字体出来为啥是水平排列的?
你好老师,为啥我用新标签这个完全显示不了?没看出问题在哪儿 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .header{ width: 1400px; background-color: pink; } div{ margin-top: 10px; height: 600px; } .nav{ height: 80px; margin-top: 10px; background-color: pink; } .section{ width: 900px; margin-top: 10px; background-color: pink; height: 600px; float: left; } aside{ width: 480px; margin-top: 10px; background: pink; height: 600px; float: right; } .footer{ height: 80px; margin-top: 10px; background-color: pink; } </style> </head> <body> <header>头部</header> <nav>导航</nav> <div> <section>主要内容</section> <aside>侧边栏</aside> </div> <footer>脚部</footer> </body> </html>
为什么我的代码没有自动预测功能
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action="ok.html" name="form1"></form> <p> 邮箱:<input type="email"> </p> <p> <input type="submit"> </p> </body> </html>
老师,form的type输了email后,打开网页,输入正确邮箱和任何数字都无提示,点击提交也没反应,页面不跳转
老师,是路径错了吗?为什么图标不显示????
老师我没有群老师我没有群老师我没有群老师我没有群
这些标签是只能放在一起用吗?也就是一个固定的模板吗?
是这个吗 代码补全 升级需要花钱 视频中不是说免费吗
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Title</title> <style> *{ margin: 0; } .box{ width: 1263px; height: 750px; /*background: red;*/ } .wrap{ width: 25%; height: 375px; /*background: blue;*/ float: left; padding: 10px; box-sizing: border-box; position: relative; } .items>img{ width: 100%; height: 100%; } .items-name{ position: absolute; top: 265px; left:25px; } .items-name1{ left:90px; } .items-information{ position: absolute; top: 300px; left:40px; } .items-information1{ left:25px; } .items-price{ position: absolute; top: 310px; left:100px; } .box-p{ width: 303px; height: 80px; } .box-p>p:first-of-type{ color: #333333; font-size: 16px; margin-top: 1px; } .box-p>p:nth-child(2){ font-size: 14px; color: #999999; } .box-p>p:last-of-type{ font-size: 22px; color: #cc0000; } span{ color: #999999; font-size: 12px; } .items:hover{ box-shadow: 0 10px 10px rgba(0,0,0,.18); /*transform: scale(1.1);*/ } .circle{ width: 50px; height: 50px; border-radius: 50%; background: linear-gradient(to bottom right,hotpink,pink); position: absolute; top: 20px; left: 20px; line-height: 50px; } /* 移动端*/ @media screen and (max-width: 768px) { .wrap{ width: 50%; } } /* Ipad端*/ @media screen and(max-width: 992px) and (min-width: 768px){ .wrap{ width: 33%; } } /* pc端*/ @media screen and (min-width: 992px){ .wrap{ width: 25%; } } </style> </head> <body> <div class="box"> <div class="wrap"> <div class="items"> <img src="魅族images/be6fed05-168e-4633-bc1d-6e75705fce07.jpg" alt=""> <p class="items-name" style="font-size: 21px;font-weight: 700;color: #ffffff">魅族 HD60 头戴式蓝牙耳机</p> <p class="items-information" style="color: #ffffff;font-size: 14px">40mm生物振膜 | 触控操作 | 蓝牙5.0</p> <p class="items-price" style="font-size: 24px;font-weight: 700;color:gold">¥499</p> </div> </div> <div class="wrap"> <div class="items"> <img src="https://openfile.meizu.com/group1/M00/08/5E/Cgbj0V_38NOAGvEXAAN6WGRLi3Y197.png" alt=""> <div class="box-p" align="center"> <p>魅族 POP Pro 主动降噪耳机</p> <p>【限时特惠449元+3期免息】</p> <p>¥449 <span><small><del>¥499</del></small></span></p> </div> </div> <div class="circle" style="color: white;text-align: center"> <p>免息</p> </div> </div> <div class="wrap"> <div class="items"> <img src="https://openfile.meizu.com/group1/M00/08/40/Cgbj0V-JCMSAa5qBAAMth2Y6_gU978.png" alt=""> <div class="box-p" align="center"> <p>魅族 POP2s 真无线耳机</p> <p>【限时特惠199元+3期免息】</p> <p>¥199 <span><small><del>¥299</del></small></span></p> </div> </div> <div class="circle" style="color: white;text-align: center"> <p>免息</p> </div> </div> <div class="wrap"> <div class="items"> <img src="https://openfile.meizu.com/group1/M00/07/2F/Cgbj0Vy_C3GAN_TKAAExaPfTwFc180.png" alt=""> <div class="box-p" align="center"> <p>魅族 HIFI 解码耳放</p> <p>【限时特惠149元】</p> <p>¥149 <span><small><del>¥169</del></small></span></p> </div> </div> </div> <div class="wrap"> <div class="items"> <img src="https://fms.res.meizu.com/dms/2019/08/29/04811a8d-07fb-4188-a852-1971f442d08f.jpg" alt=""> <p class="items-name items-name1" style="font-size: 21px;font-weight: 700;color: #ffffff">魅族 EP3C 耳机</p> <p class="items-information items-information1" style="color: #ffffff;font-size: 14px">Hi-Res 认证高解析音质 | Type-C数字接口</p> <p class="items-price" style="font-size: 24px;font-weight: 700;color:gold">¥ 129</p> </div> </div> <div class="wrap"> <div class="items"> <img src="https://openfile.meizu.com/group1/M00/07/E0/Cgbj0V6z8VSAV6kEAAlCc-omYno614.png" alt=""> <div class="box-p" align="center"> <p>魅族 HD60 降噪耳机</p> <p>【限时特惠799元+12期免息】</p> <p>¥799 <span><small><del>¥1099</del></small></span></p> </div> </div> <div class="circle" style="color: white;text-align: center"> <p>免息</p> </div> </div> <div class="wrap"> <div class="items"> <img src="https://openfile.meizu.com/group1/M00/07/86/Cgbj0V3UocyAR_tJAApbDmCAyEo620.png" alt=""> <div class="box-p" align="center"> <p>魅族 HD60 头戴式蓝牙耳机</p> <p>40mm生物振膜 | 触控操作 | 蓝牙5.0</p> <p>¥449</p> </div> </div> </div> <div class="wrap"> <div class="items"> <img src="https://openfile.meizu.com/group1/M00/04/17/Cgbj0VrcX6yABHxPAARZwWUAjc4748.png" alt=""> <div class="box-p" align="center"> <p>魅族 HALO 激光蓝牙耳机</p> <p>炫酷夜跑神器 随性张扬</p> <p>¥449 <span><small><del>¥999</del></small></span></p> </div> </div> </div> </div> </body> </html>
我为什么缩小到移动端的时候,图片并没有变小,感觉所有的格式都乱了呢,还有就是并没有按相应该显示的几个
非常抱歉给您带来不好的体验!为了更深入的了解您的学习情况以及遇到的问题,您可以直接拨打投诉热线:
我们将在第一时间处理好您的问题!
关于
课程分类
百战程序员微信公众号
百战程序员微信小程序
©2014-2025百战汇智(北京)科技有限公司 All Rights Reserved 北京亦庄经济开发区科创十四街 赛蒂国际工业园网站维护:百战汇智(北京)科技有限公司 京公网安备 11011402011233号 京ICP备18060230号-3 营业执照 经营许可证:京B2-20212637