Use HTML, CSS, JAVASCRIPT to complete 使用HTML、CSS、JAVASCRIPT來完成
Design comparison
Solution retrospective
In this problem, I solved the problem of displaying the picture at the beginning, the problem of placing the FAQ, and the problem of displaying the answer after clicking, which makes me proud.
在這個問題當中,我解決了一開始圖片顯示的問題,faq位置擺放的問題,點擊之後顯示answer的問題,讓我感到自豪。
What challenges did you encounter, and how did you overcome them?For the image problem at the beginning, I searched a lot of information and found that it could be solved by using header, main, and footer. The next step is how to center the FAQ. I used position to solve this problem. It seems like a simple problem, but it is a big step forward for me! There is also Javascript to control the html class. Because display:flex; is used on the parent component to handle horizontal issues, it will be displayed horizontally after clicking. Later, when I searched for problems and methods one by one, I found that just put the question and icon outside a div or section, and then add display:flex; justify-content:space-detween;
一開始的圖片問題,查詢了很多資料才找到可以用header、main、footer來解決。 再來是要怎麼將faq置中,用了position來解決這個問題,看似簡單的問題,但是對我來說卻是一大步的進步! 還有Javascript來控制html的class,因為在母元件上是用display:flex;來處理橫向問題,所以點擊了之後是水平顯示。後來逐一尋找問題跟方法的時候才發現只要將question和icon外放一個div或section,然後再加上display:flex; justify-content:space-detween;就可以了。
What specific areas of your project would you like help with?I feel that my writing is very messy. There are some places that I feel I can write without repeating, and there are still many places that need to be revised and learned! Such as grammar, usage, typesetting, etc.
我覺得我寫的很亂七八糟,有一些地方感覺是可以不用重複寫的,還有很多地方需要修改並且學習的!像是語法、使用方式還有排版等等。
Community feedback
- @YacoubDweikPosted about 1 month ago
當一個選項卡處於活動或開啟狀態時,所有其他選項卡都應關閉或隱藏
Marked as helpful1@DerRightPosted 23 days agoHello @YacoubDweik , is everything ok? Thank you very much for your advice! Sorry I haven't replied to your message because I've been a little busy lately.
I understand what you mean, I will correct it and learn how to do it! Have a nice day!😊
1
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord